1

例としてこのjsfiddleを実行してください。

http://jsfiddle.net/AFzqt/11/

私の例では、上記と同じリンクがあります。最初のボックスに入力すると、2番目のボックスの値がコピーされます。コードを見て、ディスプレイを見てください。ボックスを2回表示するためだけに、コードが繰り返されます。ええと...これを実際に使用するときは、理想的にはこれらのボタンを約40個配置したいと思います。

コードを40回コピーせずにこれを行う方法はありますか？ 私はjqueryを初めて使用します。通常は別の言語で引数を渡すだけですが、この構文ではどうすればよいかわかりません。どうすればこれを処理できますか？

jsfiddleに手を出して、新しいリビジョンをリンクして、エントリIDをパラメータとして使用する2つの「上記と同じ」ボタンの処理を1つの関数に減らすことを目的としています。

4

2 に答える 2

3

各ボタンにクラスを追加するchangeButtonと、イベントハンドラーをバインドするために各ボタンを選択するのが簡単になります。

<a href="#" class="changeButton">Same as Above</a>

次に、次のように各要素を選択できます。

$(".changeButton").on("click", function(e) {

    //select the previous jQuery Mobile select widgets, we will use just the previous two
    var $allPrev = $(this).prevAll('.ui-select').find('select');

    //change the value of the immediate previous select widget to the value of the one preceding it
    $($allPrev[0]).val($($allPrev[1]).val()).selectmenu("refresh");

    e.preventDefault();
});

これがデモです：http：//jsfiddle.net/AFzqt/12/

このコードは、HTML構造の直感的な知識を使用して機能するため、多数のボタンで機能します（各リンクは、ページ上のどこにリンクが存在するかに関係なく、前の2つの選択ウィジェットを使用します）。

于 2012-04-16T19:05:07.753 に答える
0

このようなものはどうですか？

function bind_click(button_id, target_id, origin_id) {
  $(button_id).on("click", function(e) {
    $(target_id).val($(origin_id).val());
    $(target_id).selectmenu("refresh");
    e.preventDefault();
  });
}

$(function() {
  bind_click("#changeButton2", "#entry_20", "#entry_18");
  bind_click("#another", "#entry", "#entry2");
  // More binding declarations
});
于 2012-04-16T18:40:23.297 に答える