Question

实际上，我有超过8个输入w / 8个不同的id＆＃;我想将jquery对象传递给onlblur事件函数，因此我不需要创建8个重复的函数＆amp;只制作1个脚本功能。我一直在努力寻找堆栈溢出几个小时，但无法找到我的问题的答案，或者我可能只是jquery的新手。希望你能帮助我和我提前谢谢......

   function fill(t,xx,zz) {
    $(xx).val(t);
    setTimeout("$(zz).hide();", 200);
}

 <input  type="text" id="inputString" size="50" value="" onkeyup="lookup(this.value);" onblur="fill(this.value,'#inputString','#suggestions');" />  
 <div class="suggestionsBox" id="suggestions" style="display: none;">

为了让您更好地理解代码，这是真正适用的原始代码。仅适用于1输入html标签。我打算在8输入html标签上只使用一个功能。

  <script type="text/javascript" src="jquery-1.2.1.pack.js"></script>

function lookup(xString) {
    if(xString.length == 0) {
        // Hide the suggestion box.
        $('#suggestions').hide();
    } else {
        $.post("db_rpc.php", {queryString: ""+xString+""}, function(data){
            if(data.length >0) {
                $('#suggestions').show();
                $('#autoSuggestionsList').html(data);
            }
        });
    }
} // lookup

function fill(t) {
    $('#inputString').val(t);
    setTimeout("$('#suggestions').hide();", 200);
}

Answer 1

让所有元素共享相同的类。

<div id="idOne" class="toBlur" />
<div id="idTwo" class="toBlur" />
<div id="idThree" class="toBlur" />

告诉jQuery，当blur事件被触发时，您希望将相同的函数应用于每个项目。

$(".toBlur").blur(function() {
  // Do whatever.
});

此外，如果您要使用jQuery（它在您的问题标签中），您就不应该像在HTML中那样在HTML中分配回调。

Answer 2

您可以使用事件处理程序和类来执行此操作：

<input  type="text" class="inputString" />  
<div class="suggestionsBox" id="suggestions" style="display: none;">

JS

$('.inputString').on({
    keyup: function() {
        lookup(this.value);
    },
    blur: function() {
        var self = this;
        setTimeout(function() {
            $(self).next('.suggestionsBox').hide()
        },200);
    } 
});

Answer 3

通过将参数传递给两个函数，我使用了1个函数用于8输入标签。我放置了一个switch语句来确定在函数fill上看到的输入标记id。我还在函数查找中添加了另一个POST变量。以下是我修改过的代码：

 function lookup(inputString,nn) {
    if(inputString.length == 0) {
        // Hide the suggestion box.
        $('#suggestions').hide();
    } else 
    {
        $.post("db_rpc.php", {queryString: ""+inputString+"",nns: ""+nn+""}, function(data) 
        { //nns added a new post variable nns for php mysqli
            if(data.length >0) {
                $('#suggestions').show();
                $('#autoSuggestionsList').html(data);
            }
        });
    }
}; // lookup

function fill(xx,n) {
switch(n) {
  case 1:
   $('#namedetails').val(xx); // input id
   break;
  case 2:
   $('#catdetails').val(xx);
   break;
}   
setTimeout("$('#suggestions').hide();", 200);
};     


<td class="absy"><input name="namedetails" type="text" id="namedetails" size="50" value="" onkeyup="lookup(this.value,1);" onblur="fill(this.value,1);"/>
        <div class="suggestionsBox" id="suggestions" style="display: none;">
            <img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
            <div class="suggestionList" id="autoSuggestionsList">
                &nbsp;
            </div>
        </div>

我只想感谢所有努力回答我的问题的人......我仍然从你的建议中学到了一些东西。也许我的问题对你们来说有点模糊，可能是因为我对jquery＆amp;只是在经历了长期的复兴编码。再次感谢...

如何将多个jquery对象传递给js函数？

3 个答案: