Question

我想选择DIV中存在的一组特定按钮并将其ID分配给页面上的隐藏字段，但我不能在我的生活中选择div内的按钮。示例在下面失败

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

您的第一个示例失败了，因为您尝试定位一个前面有.而不是:的类。您可能还试图定位类型按钮的元素，但有问题的元素是提交类型。

您的第二个示例失败，因为您尝试在不存在时选择类型按钮的输入（您的目标是类型提交）。另一种选择是input[type=submit]。

你的第三个例子由于类似的原因而失败，第一个例子失败了，因为它正在寻找一个类型为button的元素。

另见http://api.jquery.com/button-selector/

Answer 2

在.ButtonGroupWrapper类中放置一个空格查找任何.button类。（注意：不是任何＆＃39;按钮＆＃39;，但任何代码类=＆＃34;按钮＆＃34;添加到其中）

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

在您的HTML代码中，提交输入有一个＆＃39;类＆＃39; ＆＃39;按钮＆＃39;。它实际上可能是.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函数中。

Answer 3

这将有效：

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

Jquery在div中选择按钮

3 个答案: