0

実際、HTMLには8つの異なるIDを持つ8つ以上の入力があり、jqueryオブジェクトをonlblurイベント関数に渡したいので、8つの繰り返し関数を作成する必要はなく、1つのスクリプト関数のみを作成します。私はStackoverflowの検索に何時間も懸命に取り組んできましたが、質問に対する答えが見つからなかったか、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タグで1つの関数のみを使用することを計画しています。

  <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);
}
4

3 に答える 3

2

すべての要素が同じクラスを共有するようにします。

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

blurイベントが発生したときに、クラスの各アイテムに同じ関数を適用することをjQueryに伝えます。

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

また、jQueryを使用する場合（質問タグに含まれています）、コールバックをHTMLで割り当てる必要はありません。

于 2012-12-19T09:45:17.270 に答える
0

これは、イベントハンドラーとクラスを使用して行います。

<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);
    } 
});
于 2012-12-19T09:46:35.810 に答える
0

両方の関数に引数を渡すことで、8入力タグの1セットの関数を使用して動作させました。関数fillで見られるように、入力タグIDを決定するためにswitchステートメントを配置しました。また、関数ルックアップに別の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に不慣れで、長い休憩の後にコーディングを復活させたからでしょう。再度、感謝します...

于 2012-12-20T01:15:10.527 に答える