0

私はこのタスクで立ち往生しています：

onclick = "myFunction（this）;"でアタッチされた関数があります 私のページの何十もの画像に。関数内で、クリックした画像のクラス名を取得します。最後に、htmlフォームの内部を調べて、取得したクラスと同じIDの入力フィールドを変更したいと思います。

明確にする例を次に示します。

  1. ユーザーがclass="green"の画像をクリックします
  2. id = "green"のフォームの入力フィールドを見つけて、その値を1に変更します。

また

  1. ユーザーがclass="red"の画像をクリックします
  2. id = red "のフォームの入力フィールドを見つけて、その値を1に変更します。

等々..

私はほとんどのコードを持っていますが、取得した画像のクラスを使用してフォーム内の対応するIDを見つける方法がわかりません。

4

2 に答える 2

1

jQueryを使用していて、質問に「jquery」というタグを付けたので、onclick=...jQueryを使用してハンドラーを割り当てる必要はありません。

$("img").click(function() {
    $("#" + $(this).attr("class")).val("1");
    // or
    $("#" + this.className).val("1");
});

しかし、既存のものを使用すると、myFunction()これを行うことができます：

function myFunction(el) {
    var matchingInput = document.getElementById(el.className);
    if (matchingInput)
        matchingInput.value = "1";
}

「htmlフォームの内部を見る」という概念は、探している要素にIDがある場合は実際には当てはまりません。これは、（htmlが有効な場合）特定のIDを持つ要素が1つしかないため、参照を取得できるためです。document.getElementById()またはjQuery/CSSセレクターと同等の要素に直接$("#someid")。

classこの目的で属性を使用すると、同じimg要素に他のクラスを割り当てることができなくなるため、代わりにdata-xxx属性を使用することをお勧めします。

<img data-relatedFieldId="field1" class="someclass1 someclass2" src="...">

そしてあなたの関数で：

$("#" + $(this).attr("data-relatedFieldId")).val("1");
于 2012-07-21T02:45:53.080 に答える
0

クラス名を記号で連結し#、入力タグを選択できます。

 var clas = $(this).attr('class') // if image has only 1 class 
 $('#' + clas).val('1')
于 2012-07-21T02:42:09.977 に答える