我无法使用jquery选择输入的值

I cant pick the value of input using jquery

本文关键字:选择 输入 jquery      更新时间:2023-11-03
$('.submit__form').on('click', function(e) {
    e.preventDefault();
    var id = '.' + $(this).data('id');
    var person__name = $('#person__name').val();
    var person__email = $('#person__email').val();
    var booking__participants = $('#booking__participants').val();
    alert(person__email || 'none');
    // if (person__email === '' || person__name === '' || booking__participants === '') {
    //  alert('Preencha os campos obrigatórios.');
    // } else {
    //  $(id).submit();
    // }
});

不知道为什么,但是我无法选择person__name和person__email的值,最奇怪的部分是我可以在浏览器上的控制台中选择值......有人知道是什么原因造成的吗?

这不是html的问题,2个输入字段具有id person__name和person__email。

代码在外部文件中,我在 html 的底部调用它。

.HTML:

<form>
<input id="person__name" name="person.name" type="text" />
<input id="person__email" name="person.email" type="email" />

<a class="submit__form">Submit</a> 
</form>

我无法使用提交输入。

更新:

页面底部的脚本:

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.mask/0.9.0/jquery.mask.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/headroom/0.6.0/headroom.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.5/waypoints.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/velocity/1.1.0/velocity.min.js"></script>
<script src="//cdn.jsdelivr.net/velocity/1.1.0/velocity.ui.min.js"></script>
<script src="/client/scripts/main.js"></script>

在主脚本内:

(function() {
 //code
})();

如果要提醒名称,请确保在 jQuery 中使用该名称

alert(person__name || 'none');
// Not:
alert(person__email || 'none');

http://jsfiddle.net/376fLujs/3/

此外,请确保您的脚本已正确包含。在脚本之前包含 jQuery:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="local.js" type="text/javascript"></script>
  1. 添加:控制台.log("工作"(; 作为脚本的第一行
  2. 打开Chrome控制台/Firebug并刷新页面。
  3. 如果您在控制台中没有看到"工作",则您的 JavaScript 未正确包含。

编辑:再次根据您的评论。 如果您有多个表单,重复使用相同的 ID,它将不起作用。 始终保持 ID 唯一。 由于您的链接就像您的输入一样位于表单内部,因此您可以这样做:

var person__email = $(this).parent().find("input[name='person.email']").val();
// DRX points out that escaping may be necessary:
var person__name = $(this).parent().find("input[name='person''.name']").val();

http://jsfiddle.net/376fLujs/4/

我会

说尝试将其用于事件处理:

$(document).on('click', '.submit__form', function(e) {
    //code here
});

它可能不起作用的原因是,在加载脚本时可能尚未创建元素。这应该解决这个问题。