.val()方法不能设置值

Question

.val()方法不能设置值

3

我有一个名为locEmailMsg的文本输入框：

<input type="text"
       class="phColor"
       data-placeholder="Your email address"
       maxlength="50"
       style="font-size: 14px; width: 232px;"
       id="locEmailMsg">

在我的 $(document).ready() 函数中，我需要做几件事情：设置输入框的值，设置数据占位符属性和移除 phColor 类。

$('#locEmailMsg').val(localStorage.email);
$('#locEmailMsg').attr('data-placeholder', localStorage.email);
$('#locEmailMsg').removeClass('phColor');

数据占位符属性已经被正确设置（在Firebug中观察），但值没有被设置，类别也没有被删除。为什么一部分能工作，而另一部分则不能工作？

这是一个非常庞大的系统的一部分，但我已经逐步检查了页面加载时所有的脚本，并且在此调用之后没有发生任何撤销设置值/类别移除的行为。

- EmmyS

3

你是否有可能在重复使用相同的ID吗？ - thescientist

1

你能在 jsFiddle 中重新创建这个问题吗？你上面的代码看起来没问题。 - j08691

1

@asawyer - 我已经尝试过链接它了；这并没有什么区别（也不应该有）。链接和分开的行应该完全一样。 - EmmyS

1

@jcalabris - 我不需要这样做 - 我知道JavaScript本身是有效的，因为设置data-placeholder属性的那一行代码是有效的。 - EmmyS

1

@AngeloA - 是的，localStorage.email已经设置了；正如我所说，设置data-placeholder的那一行代码是有效的。 - EmmyS

显示剩余12条评论

2个回答

2

你的代码看起来很好，应该能正常工作。如果它不能正常工作，那么可能会有其他问题困扰着那一行。

我建议尝试以下方法来检查它失败的原因：

使用 console.log 或 alert 来查看 localStorage.email 的值是否正确。
尝试 document.getElementById('locEmailMsg').value = localStorage.email; 确保这不是 jQuery 的问题。

- Selvakumar Arumugam

第二点确认了这是一个jQuery问题。很有帮助！但奇怪的是它并不是jQuery的问题。原来是浏览器缓存的问题。当我清除历史记录后，jQuery选择器开始工作了。 - Spock

非常感谢。不知何故，$('#inputID').val('New Value')无法工作，但是document.getElementById('inputID').value = 'New Value'可以工作。 - Pankaj Gaikar

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- CaffGeek · Accepted Answer

您的代码在这里可以正常工作。

http://jsfiddle.net/bWm2c/1/

然而，如果具有相同id的项目再次出现，只有第一个会受到影响。请参见这里：

http://jsfiddle.net/bWm2c/2/

无论是不是输入，ID都必须是唯一的。

我将其放入超时中，以便您可以看到更改

window.setTimeout(function() {
    var localStorage = { email: 'foo@bar.com' };

    $('#locEmailMsg')
        .val(localStorage.email)
        .attr('data-placeholder', localStorage.email)
        .removeClass('phColor');
}, 500);

以下是出现问题的 HTML 代码（仅影响第一个项目）

<input type="text"
       class="phColor"
       data-placeholder="Your email address"
       maxlength="50"
       style="font-size: 14px; width: 232px;"
       id="locEmailMsg"
       value="novalue" />

<div id="locEmailMsg">dupid</div>

<input type="text"
       class="phColor"
       data-placeholder="Your email address"
       maxlength="50"
       style="font-size: 14px; width: 232px;"
       id="locEmailMsg"
       value="novalue" />

这是我所能看到的你的代码无法工作的唯一方式。编辑在你的页面上运行此代码，以确保没有重复的 id。

http://jsfiddle.net/bWm2c/4/

$('[id]').each(function(){
  var ids = $('[id="'+this.id+'"]');
  if(ids.length>1 && ids[0]==this)
    alert('Multiple IDs #'+this.id);
});