jQuery +获取并比较元素VALUE和ALT

时间:2011-09-02 09:31:20

标签: javascript jquery html

我正在尝试修改以下脚本来执行此检查:

检查输入VALUE和ALT是否相同。

如果是:空VALUE

如果否:保持VALUE

这是我正在处理的脚本:(我注释掉的那部分,是我试图弄清楚如何自己进行更改的地方)。

    <script language="Javascript" type="text/javascript">
        //<![CDATA[
        jQuery.fn.placeholder = function(){
            return this.each(function(){
                var element = $(this)
                var insertedNow =element.after("<span class='placeholder-spanbox'>"+ element.attr('alt')+ "</span>").attr("alt","").next('.placeholder-spanbox');
                var leftOffset = (element.innerWidth() - element.width())/2+parseInt(element.css("border-left-width"));
                var topOffset = ((element.innerHeight() - element.height())/2)+parseInt(element.css("border-top-width"));
                var inputWidth = element.width();   
                var inputHeight = element.height(); 
                var placeholderPos = inputHeight + topOffset + leftOffset;

                insertedNow.css("padding-left",leftOffset+"px").css("padding-top",topOffset+"px").css("opacity",0.5).css("display","block").css("margin-top",-placeholderPos).css("cursor","text");
                var objCSS = {'-webkit-transition':'opacity 100ms ease-in','-moz-transition':'opacity 100ms ease-in','-o-transition':'opacity 100ms ease-in','-ms-transition':'opacity 100ms ease-in','transition':'opacity 100ms ease-in','font-size':element.css('font-size'),'font-family':element.css('font-family'),'color':'#000000','font-weight':element.css('font-weight'),'width':element.css('width'),'float':element.css('float')};
                insertedNow.css(objCSS);
                //insertedNow.offset(element.offset());
                element.bind("focus",updateSpanStatusFocus);
                element.bind("keydown",updateSpanStatusKeyDown);
                element.bind("keyup",updateSpanStatusKeyUp);
                element.bind("blur",updateSpanStatusBlur);
                insertedNow.bind("click",clickSpanBox);


                var inputVal = element.attr("value");
                var inputAlt = element.attr("alt");

                //$(this).attr("value",+inputVal);

                // if(inputVal == inputAlt){
                //  $(this).attr("value","123");
                // }    

                if(element.val()!==""){
                    insertedNow.css({'opacity':0});
                }
            });
            function clickSpanBox(event){
                event.preventDefault();
                var inputBox = $(this).prev();
                inputBox.focus();
            }
            function updateSpanStatusFocus(event){
                var $this= $(this);
                if($this.val()==""){
                    var spanBox = $this.next('.placeholder-spanbox');
                    spanBox.css("opacity","0.3");
                }
            }
            function updateSpanStatusKeyUp(event){
                var $this= $(this);
                if($this.val()==""){
                    var spanBox = $this.next('.placeholder-spanbox');
                    spanBox.css("opacity","0.3");
                }
            }
            function updateSpanStatusKeyDown(event){
                var $this = $(this);
                if($this.val()=="" && (event.keyCode>54 || event.keyCode == 32)){
                    var spanBox = $this.next('.placeholder-spanbox');
                    spanBox.css("opacity","0");
                }
            }
            function updateSpanStatusBlur(){
                var $this= $(this);
                $this.val(Trim($this.val()+''));
                if($this.val()==""){
                    var spanBox = $this.next('.placeholder-spanbox');
                    spanBox.css("opacity","0.5");
                    spanBox.css("color","#000000");
                }
            }
        }

        $(document).ready(function(){
            $('.spanOverlay').placeholder();
        });

        //]]>
    </script>

这里是html标记示例:

<input type='text' name="userName" class='contactInput spanOverlay' alt='* Name' value='test'></input>

感谢您的帮助!!

2 个答案:

答案 0 :(得分:2)

这是你想要的吗?

if (element.val() == element.attr('alt')) {
    element.val("");
}

答案 1 :(得分:0)

在javascript中有一个名为.defaultValue的东西你可以用它来比较当前值

这是一个关于如何完成的例子

http://www.miuaiga.com/index.cfm/2009/8/31/jQuery-form-input-defaultValue