1

在表格中,我有一行有两个输入 - 一个选择和一个文本。我想要实现的是,如果一个有一个值,那么另一个(在同一行)应该禁用。当文本框中有一个值时,这在加载时可以正常工作,但当只有选择框中有一个值时,这似乎不起作用。

正如您在此处的示例中看到的那样:http: //jsfiddle.net/anAgent/UBUhn/1/ “更改”事件正常工作,但它不起作用onload

任何帮助将不胜感激!

我正在使用 jQuery 1.5.2 以及 Google Chrome 和 IE9


使用最终代码更新

感谢@scoopseven 和@eicto 的输入。基于这两个答案,这是最终的代码。我希望它可以帮助别人。

$(document).ready(function() {
    $(".validation-compare").change(runRowValidation);
    $(".validation-compare").each(runRowValidation);
});

function runRowValidation() {
    var $me = $(this),
        $other = $('.validation-compare',$me.closest("tr")).not($me),
        mVal = $me.val(),
        oVal =$other.val();

    if(mVal != "" && oVal == "") {
       $me.removeAttr('disabled');
       $other.attr('disabled',1);        
    } else if(mVal == "" && oVal != "") {
       $other.removeAttr('disabled');
       $me.attr('disabled',1); 
    } else {
        $other.removeAttr('disabled');
        $me.removeAttr('disabled');
    }
}​

您可以在以下网址看到它的实际效果:http: //jsfiddle.net/anAgent/UBUhn/24/

4

3 回答 3

1
var validme=function() {
    var me=$(this);
    me.removeClass('validation-compare');
    if (me.val()) {
        console.log(me);
        me.addClass('valid');
        me.parent().parent().find('.validation-compare').attr('disabled',1);
        me.addClass('validation-compare');
        return;
    }          
    me.removeClass('valid');   
    if (me.parent().parent().find('.validation-compare.valid').length<1) {

        me.parent().parent().find('.validation-compare').removeAttr('disabled'); }
    me.addClass('validation-compare');
}
    $('.validation-compare').each(validme);    
    $('.validation-compare').change(validme)

http://jsfiddle.net/UBUhn/22/

于 2012-07-31T13:52:44.483 回答
1

我认为您不需要设置课程valid,您所要做的就是替换

var $otherInput = $('.validation-compare', $parent).not('.valid');

经过

var $otherInput = $('.validation-compare', $parent).not($me);

这将解决您在onload上的问题。这是一个例子

于 2012-07-31T13:58:57.763 回答
0

您需要分离出该函数并在点击事件和页面加载时调用它。像这样的东西:

    jQuery(function($){

        function myFunction() {
            // do somestuff
        }

        // myFunction needs to be called when select is clicked and when page is loaded
        $('#someelement').click(myFunction);
        $(document).ready(myFunction);

     });
于 2012-07-31T13:27:27.763 回答