无法使用 jquery 访问 bootstrap 模态中的元素 ID，出现未定义错误

Question

Jquery 和 Bootstrap 模态框代码在同一个页面让我们说 index.php

<div class="modal fade" id="tileModal" tabindex="-1" role="dialog" aria- 
                    labelledby="mytileModal" aria-hidden="true">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header"><button type="button" class="close" 
data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">Select Tiles</h4>
              </div>
              <div class="modal-body">
               <div id="result"> </div>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" id="saveChange">Save changes</button>
              </div>
            </div>
          </div>
        </div>

注意：DIV 得到 ajax 响应 html 并且元素是动态绘制的。在这种情况下绘制元素之后 checkbox 。在 saveChange 按钮上单击模式我想获取复选框值。

$("#saveChange").click(function () {
    var midVal = $('#test1').val();
    console.log(midVal);
});

变得不确定

不确定为什么我无法从同一页面访问模态元素。但是我能够访问模态

之外的其他 DIV 的元素

Answer 1

将事件附加到容器而不是直接附加到元素。也可以直接使用 on('click', ... 而不是 click。

$("#tileModal").on('click', '#saveChange', function () {
    var midVal = $('#test1').val();
    console.log(midVal);
});

Answer 2

我检查复选框是否被选中的解决方案很简单。我刚刚创建了 class 并且能够在 bootstrap 模式

中轻松检查复选框是否被选中

$('.className').is(':checked'); // 有效 $('#elementId').is(':checked'); // 总是给出 false

无法使用 jquery 访问 bootstrap 模态中的元素 ID，出现未定义错误

Cannot access element id's in bootstrap modal using jquery, getting undefined error

jquery

modal-dialog

undefined

twitter-bootstrap-3