本帖最后由 mouse0987 于 2013-03-28 15:35:05 编辑

解决方案 »

  1.   

    没有事件,你可以找到源码中的show方法,添加一个回调,那样就可以了
      

  2.   

    没事件,只是把自身根据选择器选择到的DOM元素进行css的更改。style='block'
      

  3.   


    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script src="http://libs.baidu.com/jquery/1.8.3/jquery.js"></script>
    <script type="text/javascript" src="jquery.html5-placeholder-shim.js"></script>
    <title>无标题文档</title>
    <style type="text/css">
    body {
    margin: 0;
    padding: 0;
    }
    </style></head><body>  <input id="btn" type="text" placeholder="你好" />
      <input type="password" placeholder="大家好" />
      <textarea rows="8" cols="10" placeholder="为什么"></textarea>
      <input type="button" value="显示" onmouseover="document.getElementById('xxx').style.display='block'" />
      <div id="xxx" style="display: none;" >
       <form>
    <input type="password" placeholder="各位好1" />
    <input type="password" placeholder="各位好2" />
    <input type="password" placeholder="各位好3" />
    </form>
      </div>
    </body>
    </html><script type="text/javascript">
    (function($) {
      // @todo Document this.
      $.extend($,{ placeholder: {
          browser_supported: function() {
            if(($.browser.msie && ($.browser.version="10.0")) || ($.browser.opera))
            {
              return false;
            }         return this._supported !== undefined ?
              this._supported :
              ( this._supported = !!('placeholder' in $('<input type="text">')[0]) );      },
          shim: function(opts) {
            var config = {
              color: '#f00',
              cls: 'placeholder',
              selector: 'input[placeholder], textarea[placeholder]'
            };
            $.extend(config,opts);
            return !this.browser_supported() && $(config.selector)._placeholder_shim(config);
          }
      }});  $.extend($.fn,{
        _placeholder_shim: function(config) {
          function calcPositionCss(target)
          {
            var op = $(target).offsetParent().offset();
            var ot = $(target).offset();        return {
              top: ot.top - op.top,
              left: ot.left - op.left,
              width: $(target).width()
            };
          }
          return this.each(function() {
            var $this = $(this);        if( $this.is(':visible') ) {          if( $this.data('placeholder') ) {
                var $ol = $this.data('placeholder');
                $ol.css(calcPositionCss($this));
                $this.attr('placeholder','');
                return true;
              }          var possible_line_height = {};
              if( !$this.is('textarea') && $this.css('height') != 'auto') {
                possible_line_height = { lineHeight: $this.css('height'), whiteSpace: 'nowrap' };
              }          var ol = $('<label />')
                .text($this.attr('placeholder'))
                .addClass(config.cls)
                .css($.extend({
                  position:'absolute',
                  display: 'inline',
                  float:'none',
                  overflow:'hidden',
                  textAlign: 'left',
                  color: config.color,
                  cursor: 'text',
                  paddingTop: $this.css('padding-top'),
                  paddingRight: $this.css('padding-right'),
                  paddingBottom: $this.css('padding-bottom'),
                  paddingLeft: $this.css('padding-left'),
                  fontSize: $this.css('font-size'),
                  fontFamily: $this.css('font-family'),
                  fontStyle: $this.css('font-style'),
                  fontWeight: $this.css('font-weight'),
                  textTransform: $this.css('text-transform'),
                  backgroundColor: 'transparent',
                  zIndex: 99
                }, possible_line_height))
                .css(calcPositionCss(this))
                .attr('for', this.id)
                .data('target',$this)
                .click(function(){
                  $(this).data('target').focus();
                })
                .insertBefore(this);
              $this
                .data('placeholder',ol)
                .keypress(function(){
                  ol.hide();
                })
                .focus(function(){
                  ol.css('color','#dbdcdc');
                })
                .blur(function() {
                  ol[$this.val().length ? 'hide' : 'show']();
                  ol.css('color','#f00')//595757
                }).triggerHandler('blur');          $(window)
                .resize(function() {
                  var $target = ol.data('target');
                  ol.css(calcPositionCss($target));
                });
            }
          });
        }
      });
    })(jQuery);jQuery(document).bind('ready load', function() {
      if (jQuery.placeholder) {
        jQuery.placeholder.shim();
      }
    });</script>
      

  4.   


    请问大仙我的这段代码为何点击三次“显示”按钮才会成功执行。谢谢!<!DOCTYPE HTML>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script src="http://libs.baidu.com/jquery/1.8.3/jquery.js"></script><title>无标题文档</title>
    <style type="text/css">
    body {
    margin: 0;
    padding: 0;
    }
    </style>
    </head><body>  <input type="text" placeholder="你好" />
      <input type="password" placeholder="大家好" />
      <textarea rows="8" cols="10" placeholder="为什么"></textarea>  <input id="btn" type="button" value="显示" />  <div id="xxx" style="display: none; " >
        <form>
      <input type="password" placeholder="各位好1" />
      <input type="password" placeholder="各位好2" />
      <input type="password" placeholder="各位好3" />
    </form>
      </div>  <div>123456789</div>
    </body>
    </html>
    <script type="text/javascript">
      $("#btn").click(function(){
        $("#xxx").show(0,jQuery.placeholder.shim());
    });(function($) {
      // @todo Document this.
      $.extend($,{ placeholder: {
          browser_supported: function() {
            if(($.browser.msie && ($.browser.version="10.0")) || ($.browser.opera))
            {
              return false;
            }         return this._supported !== undefined ?
              this._supported :
              ( this._supported = !!('placeholder' in $('<input type="text">')[0]) );      },
          shim: function(opts) {
            var config = {
              color: '#f00', //595757
              cls: 'placeholder',
              selector: 'input[placeholder], textarea[placeholder]'
            };
            $.extend(config,opts);
            return !this.browser_supported() && $(config.selector)._placeholder_shim(config);
          }
      }});  $.extend($.fn,{
        _placeholder_shim: function(config) {
          function calcPositionCss(target)
          {
            var op = $(target).offsetParent().offset();
            var ot = $(target).offset();        return {
              top: ot.top - op.top,
              left: ot.left - op.left,
              width: $(target).width()
            };
          }
          return this.each(function() {
            var $this = $(this);        if( $this.is(':visible') ) {          if( $this.data('placeholder') ) {
                var $ol = $this.data('placeholder');
                $ol.css(calcPositionCss($this));
                $this.attr('placeholder','');
                return true;
              }          var possible_line_height = {};
              if( !$this.is('textarea') && $this.css('height') != 'auto') {
                possible_line_height = { lineHeight: $this.css('height'), whiteSpace: 'nowrap' };
              }          var ol = $('<label />')
                .text($this.attr('placeholder'))
                .addClass(config.cls)
                .css($.extend({
                  position:'absolute',
                  display: 'inline',
                  float:'none',
                  overflow:'hidden',
                  textAlign: 'left',
                  color: config.color,
                  cursor: 'text',
                  paddingTop: $this.css('padding-top'),
                  paddingRight: $this.css('padding-right'),
                  paddingBottom: $this.css('padding-bottom'),
                  paddingLeft: $this.css('padding-left'),
                  fontSize: $this.css('font-size'),
                  fontFamily: $this.css('font-family'),
                  fontStyle: $this.css('font-style'),
                  fontWeight: $this.css('font-weight'),
                  textTransform: $this.css('text-transform'),
                  backgroundColor: 'transparent',
                  zIndex: 99
                }, possible_line_height))
                .css(calcPositionCss(this))
                .attr('for', this.id)
                .data('target',$this)
                .click(function(){
                  $(this).data('target').focus();
                })
                .insertBefore(this);
              $this
                .data('placeholder',ol)
                .keypress(function(){
                  ol.hide();
                })
                .focus(function(){
                  ol.css('color','#0f0'); //dbdcdc
                })
                .blur(function() {
                  ol[$this.val().length ? 'hide' : 'show']();
                  ol.css('color','#f00') //595757
                }).triggerHandler('blur');          $(window)
                .resize(function() {
                  var $target = ol.data('target');
                  ol.css(calcPositionCss($target));
                });
            }
          });
        }
      });
    })(jQuery);jQuery(document).add(window).bind('ready load', function() {
      if (jQuery.placeholder) {
        jQuery.placeholder.shim();
      }
    });</script>