0

我试图让这段代码在 jQuery 中工作，并且我试图确保对于每个根元素的每次迭代，其用于同一迭代的备用根元素不包含任何内容。否则，它将 .val("") 属性设置为空字符串。如果可能，使用搜索、查找或交换来寻找简单的解决方案。

每个匹配的数字都在相同的行级别和相同的迭代计数上。

我有两种输入类型的输入文本元素，它们具有两个不同的根名称，如下所示：

第一个根是“ rootA ” 

 
    <input type="text" name="rootA1" />
    <input type="text" name="rootA2 />
    <input type="text" name="rootA3" />
第二个根是“ rootB ” 
 
    <input type="text" name="rootB1" />
    <input type="text" name="rootB2 />
    <input type="text" name="rootB3" />

如果调用函数 fnRootA(); 调用任何 rootA，则在模糊时。如果调用函数 fnRootB(); 调用任何 rootB，则在模糊时。

同样，我试图确保对于像 1 这样的每次迭代，备用根不包含任何内容，否则它将 .val("") 属性设置为被模糊的根的空字符串。

我当前的代码适用于单个元素，但想使用 find 或 search 但不知道如何构造它。

$("input[name='rootA1']").blur(function(e) {
   fnRootA(1); // 这段代码只是删除了 rootA1 的值 val("")
              //如果rootB1里面有东西value属性
             // 括号中的 (1) 是迭代次数
});
4

5 回答 5

2

尝试这个

^选择器选择所有以 name = root 开头的元素

$('input[name^=root]').on('blur', function(){

    if($(this).attr('name').indexOf('rootA') > -1){

       fnRootA();
    }
    else{
        fnRootB();
    }

})​;​
于 2012-09-27T15:22:46.363 回答
1

如果您将一个类添加到您的输入中，例如class = 'rootA'前三个和class='rootB'其他三个，您可以这样做

编辑：按照@pimvdb 的建议使用hasClass

$('input').on('blur', function(){
   if($(this).hasClass('rootA'))
    alert('rootA')
   else if($(this).hasClass('rootB'))
        alert('rootB')

})

见现场小提琴

于 2012-09-27T15:28:55.537 回答
1

您可以使用 jQuery 的属性 contains selector。它选择所有rootA/rootB输入。

像这样：

$("input[name*='rootA']").blur(function(e) {
    //execute rootA function
});

$("input[name*='rootB']").blur(function(e) {
    //execute rootB function
});

（要获得输入的编号，您可以使用 string.replace 来消除根前缀）

于 2012-09-27T15:24:23.757 回答
1

jsFiddle DEMO

It looks to me like we are trying to find matching rootB# inputs, easiest way is to just grab the current name of the rootA we're grabbing and get the # following, then call the function with that number and delete the corresponding rootB# value.

$('input[name^="rootA"]').blur(function(e) {
    var _name = $(this).attr('name');

    _name = _name.substr(5);
    fnRootA(_name); 

});

function fnRootA(num) {
    console.log(num);

    $('input[name="rootB' + num + '"]').val('');
}
​
于 2012-09-27T15:25:50.557 回答
1

UPDATE

Hmmm. A little broad in your explanation, but I'll take a stab at it.

The following will grab all inputs of "rootA" and tell them "hey, on blur make all "rootB" elements go string.empty!"

$("input")
    .filter(function(e) {
        //  This should basically get a jQuery object made up of all input elements whose tag name contains "rootA"
        return $(this).attr("name").indexOf("rootA") != -1;
    })
    .blur(function(e) { //  of course the onblur function
        $("input")
            .filter(function(e) {
                //  This should basically get a jQuery object made up of all input elements whose tag name contains "rootB"
                return $(this).attr("name").indexOf("rootB") != -1;
            })
            .val("");   //  this would set their values to ""
    })

Could also be written

$("input[name*='rootA']")
    .blur(function(e) {    //    of course the onblur function
        $("input[name*='rootB']")
            .val("");    //    this would set their values to ""
    })

HOWEVER If you wanted to change ALL inputs not on the same ROOT as the inputs currently selected you could use the following

$("input")
    .blur(function(e) {    //    of course the onblur function
        // Grab the root name without Number for purpose of knowing what inputs NOT to reset
        var rootName = $(this).attr("name").substring(0, 5);
        $("input")
            .filter(function(e) {
                //    This should basically get a jQuery object made up of all input elements whose tag name contains "rootB"
                return $(this).attr("name").indexOf(rootName) == -1;
            })
            .val("");    //    this would set ALL inputs not of current root name values to ""
    })

FULL WORKING EXAMPLE WITH RESET BUTTON HERE

于 2012-09-27T15:27:46.743 回答