HTML 没有为 Bootstrap Modal 中的表单字段动态添加值属性答案

【问题标题】：HTML is not dynamically adding value attributes for form fields in Bootstrap ModalHTML 没有为 Bootstrap Modal 中的表单字段动态添加值属性
【发布时间】：2017-05-20 10:37:43
【问题描述】：

我有一个显示在模式中的“联系我”表单。当输入不正确时，用户将被定向到专用的“联系我”页面。

模态表单：

表单的专用页面：

我试图在模态本身中直接显示输入错误。我正在使用on-blur 函数来执行此操作。问题是，表单字段值不会为模式中的表单动态更新。但是，表单字段值会在专用页面中更新。

模态表单的 HTML（值属性未出现）：

专用页面中表单的 HTML（正确显示值属性）：

而且，jQuery 不会检测模态中的表单字段，而是检测专用页面中的字段。

jQuery 代码：

$(document).on('blur', '#id_name', function() {
    var name = $(this).val();
    alert(name);  // works only in the dedicated page !
});

有什么帮助吗？谢谢！

【问题讨论】：

什么时候调用 jQuery sn-p 来操作模态框，模态框是否已经显示？
我在脚本的末尾有它。我正在使用 Django，它出现在 {% block content %}{% endblock %} 之后的 base.html 中。因此，模态框已经显示在 jQuery 之前。
如果您console.log($('#id_name')); 看到控制台中的元素还是收到undefined？
在页面加载过程中什么也不显示。在模态表单提交按钮上，生成日志。它说[<input id="id_name">] (1)，但点击它什么也没显示。但是，在专用页面上，它会显示确切的输入标签。
确定因为在专用页面上 html 已经存在，当您在模式的情况下触发脚本时，元素不存在，所以您的问题。你能告诉我你是如何加载模态的吗？

标签： javascript jquery html forms twitter-bootstrap

【解决方案1】：

当您执行脚本时，您的模态框尚未附加到页面，因此无法检索元素。将你所有的脚本包装在这个里面：

$(document).ready(function() { //here all my code });

你应该解决这个问题

【讨论】：