Question

在输入中输入内容并单击按钮后，“。val（）”返回一个空值，任何想法为什么？

HTML CODE：

<div class="mainClass">
    <div class="class1" >
       <div class="class2">
         <h3>Settings 1</h3>   
        <label>
           <span>Text 1:</span>
           <input type="text" name="text">
        </label>
        <label>
           <span>Text 2:</span>
           <input type="text" name="text2">
        </label>
       </div>
    </div>

    <div class="class3" >
       <div class="class4">
         <h3>Settings 2</h3>   
        <label>
           <span>Text 1:</span>
           <input type="text" name="text">
        </label>
        <label>
           <span>Text 2:</span>
           <input type="text" name="text2">
        </label>
       </div>
    </div>
</div>
 <button id="Go" class="go" >GO </button>

JAVASCRIPT CODE：

$('#Go').on('click', function() {
    alert($('.class1 input').val());    //return an empty value 
    $('.class1 input').val("test");
    alert($('.class1 input').val());    //return test
});

编辑：

即使这不起作用，这里我只有一个输入，所以我不能输入错误的输入：

<div class="mainClass">
    <div class="class1" >
       <div class="class2">
         <h3>Settings 1</h3>   
        <label>
           <span>Text 1:</span>
           <input type="text" name="text">
        </label>        
       </div>
    </div>
</div>
 <button id="Go" class="go" >GO </button>

编辑2：我发现了问题的开始......

当我这样做时：

$('.class1 input').each(function () {
    alert($(this).attr('name') + "  value:" +$(this).val() );
});

我得到两个“警觉”：

text   value:
text   value:myinputText

因此在我的HTML中创建了两个，第一个是空的，第二个是运行良好的！仔细查看我的页面，我发现所有元素都是重复的（<select,field, input...）

知道这怎么可能？我打电话两次我的html文件？我的所有代码都在弹出窗口中（我不知道它是否可以提供帮助）（我是Javascript和jQuery的新手）

由于

Answer 1

有多个匹配'.class1 input'的元素。你可能没有填写第一组。

来自the documentation：

获取匹配集中第一个元素的当前值元件。

虽然val('text')填充了所有匹配的元素：

设置匹配元素集中每个元素的值

这就是你在第二次警报中看到某些内容的原因。

您最好使用更具选择性的选择器。通常我们使用id或名称，如果使用表单将值发送到服务器。

Answer 2

$('.class1 input').val()

指两个元素

<input type="text" name="text">

和

<input type="text" name="text2">

Answer 3

您有多个匹配的元素。

来自jQuery docs

<强> .val()

获取该组中 第一个元素 的当前值   匹配元素或设置每个匹配元素的值。

您只获得匹配集的第一个元素作为docs状态。如果你想要所有的值，你需要遍历集合。

Answer 4

围绕文档就绪块包装Jquery代码：

$('document').ready(function(){});

像这样：

$('document').ready(function(){
    $('#Go').on('click', function() {
        alert($('.class1 input').val());    //return an empty value 
        $('.class1 input').val("test");
        alert($('.class1 input').val());    //return test
    });
});

即使有谷歌搜索和Stackoverflow的大量帮助，我们花了1个小时才发现这个问题。

Answer 5

我有一个类似的问题，Chrome反复告诉我.val（）不是函数，而不是使用.val（）我必须使用.value这项工作已为我完成，希望对您有用。

jQuery.val（）不适用于<input />标记

5 个答案: