为什么jquery toggle（）在bootstrap popover中不能以表单形式工作

Question

我正在尝试在动态引导程序弹出窗口中创建一个小的html表单，它非常好用。

但是作为一个花哨的版本，我想要一个隐藏的select - 元素，只有在点击一个复选框时才显示。

在早期版本中，我没有使用popovers并使用jquerys toggle()和onclick事件，并且它运行良好。但不是在这里。

以下代码是我目前所拥有的：

var content = '
                <form id="myForm" name="myForm" enctype="multipart/form-data" method="post" action="submit_myForm.php">
                    <div class="row">
                        <label for="check" class="col-md-10">check this? *</label>
                        <input class="col-md-2" type="checkbox" name="check" value="1" onclick="$(\'#selectToToggle\').toggle();" />
                        <select id="selectToToggle" name="selectToToggle" class="col-md-10 col-md-1" hidden>
                           <option>select something</option>
                        </select>
                    </div>
                </form>
            ';
var title = "Some Title";

$('#myPopover').popover({
            placement : 'right',
            html : true,
            trigger : 'manual', 
            content: content,
            title: title
});
$('#myPopover').popover('show');

是否有原因导致onclick - 事件未触发或无效？我的代码是否有失败？

我将不胜感激任何帮助 - 谢谢：）

编辑：我认为我找到了核心问题：似乎在popover中找不到id。但是，我不知道如何解决这个问题。

Answer 1

因为你的onClick在一个字符串中，所以jQuery不会监听它，因为它不知道它在那里。

您应该在复选框中输入一个ID，然后在中添加文本到页面后，点击点击。

$('#myPopover').popover({
            placement : 'right',
            html : true,
            trigger : 'manual', 
            content: content,
            title: title
});
$('#myCheckbox').on('click', function() {
    $('#selectToToggle').toggle()
});
$('#myPopover').popover('show');