javascript - div 在用户操作时更改其内容后的 Click 和 If 函数

Question

我有这个标记:

<button id="drop_group_2" data-toggle="dropdown" href="#">
 <span>Select size</span></button>
<button type="submit" name="Submit" class="exclusive">
 <span>Add to cart</span>
</button>

问题是，如果未选择尺寸，我想阻止用户提交，所以我这样做了:

$('button.exclusive').on('click', function(){
        if ($('#drop_group_2:has(span)')) {
            alert('You must select size');
            return false;
        }
});

效果很好，但在用户选择大小后，drop_group_2 会删除跨度并获取数字大小:

<button id="drop_group_2" data-toggle="dropdown" href="#">42</button>

但是，如果用户再次单击提交，则会再次出现警报，但它永远不会消失。如果用户选择了尺寸(span 被删除)然后让用户提交它，我该怎么做？

Answer 1

您应该检查匹配元素的长度，如下所示:

$('button.exclusive').on('click', function(){
        if ($('#drop_group_2:has(span)').length) {
            alert('You must select size');
            return false;
        }
});

否则它将始终返回 true。