div内のJquery選択ボタン

Question

DIV内にある特定のグループのボタンを選択し、そのIDをページの非表示フィールドに割り当てることを希望しますが、私の人生の中では、

：

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

Answer 1

試してください：あなたは.ない:が先行するクラスをターゲットにしようとしているので、

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

あなたの最初の例が失敗しました。また、ボタンタイプの要素をターゲットにしようとしているかもしれませんが、問題の要素はタイプsubmitです。

2つ目の例では、タイプが存在しない場合（タイプがsubmitの場合）、タイプボタンの入力を選択しようとしています。代わりの方法はinput[type=submit]です。

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

はhttp://api.jquery.com/button-selector/

Answer 2

これは動作しますが失敗した

の下のdiv ..例は失敗します

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

Answer 3

はスペースを入れても参照してくださいあなたの.ButtonGroupWrapperクラス内の任意の.buttonクラスを探します。 （注：これに追加されたコードのクラス=「ボタン」ではない任意の「ボタン」、何でも）あなたのHTMLコード入力が「ボタン」の「クラス」を持って提出して

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

。 実際には、.strawberryや.mybuttonなどの何かが好きかもしれません。

オルタナティブ：

<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が考えられます：あなたは全体の多くを包むIDを持っていたよう

あなたはまた、ID内のボタンをターゲット可能性が

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

DOMがロードされた後でこれを実行する必要があることを覚えておいてください。そのため、ベストプラクティスはページの最後に書くか、あなたの好きなonready関数で。