Question

我正在构建一个包含100个项目的电子商务网站。每个项目都有一个项目选项（即小，中，大）。每个选项都有一个带整数的值，用于标识选项。

当用户点击＆＃34;添加到购物车时，＆＃34;我需要将该值表示为变量。问题是所有这些项都具有相同的类/ id，所以我不能为每个项写一个onclick函数。

如何使用jQuery获取所选的选项值onclick而不使用class / id来识别它？

项目表格的基本结构：

<form>
    <label>First Item</label>
    <select>
        <option value="6432">Large</option>
        <option value="5332">Small</option>
    </select>
    <input type="submit" value = "Add to Cart">
</form>

这是一个小提琴，展示了我所谈论的内容：http://jsfiddle.net/cusygh4o/

谢谢： - ）

Answer 1

试试这个：

$('input[type="submit"]').on('click', function(e) {
   e.preventDefault();
   alert($(this).prev('select').val());
});

更新了JSFiddle：http://jsfiddle.net/cusygh4o/1/

注意：如果有任何，您可以缩小'input[type="submit"]'选择器的范围，您应该这样做。例如，如果您的父元素具有ID，则可以执行'#shopping-items input[type="submit"]'。

之类的操作

Answer 2

<强> jsFiddle Demo

只需点击发生点击的地方即可。

$("input[type=submit]").click(function(){
  alert($(this).parents("form").find("select").val());
});

Answer 3

使用此

jQuery(document).ready(function(){
        var selectedValue;
        $('input[type="submit"]').on('click', function() {
        selectedValue=jQuery('form select').val();
        alert(selectedValue);
    })
})

Answer 4

有很多不同的方法：http://jsfiddle.net/cusygh4o/2/

$('form').on('submit', function(e) {
    alert($(this).find('select').val());
});

Answer 5

试试这个

<script>
        function getValue(e){
            value = e.closest('form').find('select').find(":selected").text();
            alert(value);
        }
</script>

然后将所有<input type="submit" value = "Add to Cart">替换为<input onclick="getValue($(this))" type="submit" value = "Add to Cart">

获取选项值OnClick没有类/ ID

5 个答案: