10

DIV 内に存在する特定のボタンのグループを選択し、それらの ID をページの非表示フィールドに割り当てたいのですが、私の人生で div 内のボタンを選択することはできません..以下の例は失敗します

ソース HTML

    <div id = test>
    <div class="ButtonGroupWrapper">                    
                    <img src="test.jpg" width="100" height="100" alt="thumbnail" />
                <input id="buttonID5" type="submit" value="Link" class="button" />
    </div>
    <div class="ButtonGroupWrapper">                    
                    <img src="test.jpg" width="100" height="100" alt="thumbnail" />
                <input id="buttonID6" type="submit" value="Link" class="button" />
    </div>
    </div>

Jquery セレクターが失敗する

    $(".ButtonGroupWrapper").find(":button").click(function () {
        alert("hi there");
        return false;
    });

    $("#ButtonGroupWrapper input[type=button]").click(function () {
        alert("hi there");
        return false;
    });

    $("#ButtonGroupWrapper :button").click(function () {
        alert("hi there");
       return false;
    });
4

3 に答える 3

15

試す：

$(".ButtonGroupWrapper").find(".button").click(function () {
        alert("hi there");
        return false;
});

.notが前に付いているクラスをターゲットにしようとしているため、最初の例は失敗します:。ボタンタイプの要素をターゲットにしようとしている可能性もありますが、問題の要素は送信タイプです。

2番目の例は、存在しないときにタイプボタンの入力を選択しようとしているため失敗します（ターゲットはタイプ送信です）。別の方法はですinput[type=submit]。

3番目の例は、ボタンタイプの要素を探しているという点で失敗した最初の例と同様の理由で失敗します。

http://api.jquery.com/button-selector/も参照してください

于 2012-08-08T19:30:30.110 に答える
10

スペースを入れると、.ButtonGroupWrapper クラス内の任意の .button クラスが検索されます。(注: 「ボタン」ではなく、コード class="button" が追加されたもの)

$(".ButtonGroupWrapper .button").click(function () {
    alert("hello");
    return false;
});

HTMLコードでは、送信入力に「ボタン」の「クラス」があります。実際には、.strawberry や .mybutton など、好きなものであれば何でもかまいません。

別：

ロット全体をラップする ID があるため、ID 内のボタンをターゲットにすることもできます。

<div id ="test">
  <div>                    
    <img src="test.jpg" width="100" height="100" alt="thumbnail" />
    <input type="submit" value="Link" class="button" />
  </div>
  <div>                     
    <img src="test.jpg" width="100" height="100" alt="thumbnail" />
    <div class="button" />Just text</div>
  </div>
</div>

そして、あなたのJavaScriptは次のようになります：

$("#test .button").click(function () {
     alert("button class clicked");
    return false;
});

DOM がロードされた後にこれを実行する必要があることに注意してください。そのため、ページの最後に記述するか、お気に入りの onready 関数でラップすることをお勧めします。

于 2014-05-15T16:43:52.310 に答える
1

これは機能します： 

$(".ButtonGroupWrapper").find(".button").click(function () {
    alert("hi there");
    return false;
});
于 2012-08-08T19:30:25.973 に答える