在模态窗口jquery中隐藏选择选项

Question

我的页面上有一个日历，下面是代码。当用户点击日期时，它会展开并显示可用的时间段，每个时间点都有一个预约按钮。用户单击该按钮，将显示带有表单的模态窗口。其中一个字段是选择下拉列表，我想隐藏其中一个选项。

主页/父页面上的代码

jQuery(document).ready
(
function($)
{
    //$("select[name~='2284733'] option[value='187']").hide();
    $("select[name*='2284733']").on('click',
    function ()
    {
        $(this).option[value='187'].hide();
    }
    );
});

模态窗口中的代码

<select name="service-label---2284733">
    <option value="">Select a Product</option>
    <option value="187">Rock Climbing Wall</option>
    <option value="183">Synthetic Ice</option>
    <option value="151">$35 - Sports Simulator</option>
</select>

Answer 1

如果使用javascript将元素添加到页面中（通常是模式框中发生的情况），则需要将click事件附加到文档中：

jQuery(document).ready(function($) {
    // $("select[name~='2284733'] option[value='187']").hide();
    $(document).on('click', 'select[name*="2284733"]', function () {

        $(this).find('option[value="187"]').hide();
    });
});