使用Javascript更改输入文本值不会更改显示

Question

I'm trying to change the value of a text input field based on user actions. I'm doing it like this:

document.getElementById(textFieldID).value = newValue;

It isn't quite working -- the original text in the field remains on the screen, unchanged. However, when I submit the form, it behaves as though the value was indeed changed correctly. (And a debug alert confirms that yup, I'm hitting that bit of the code and passing in the right field ID and text value.) Anybody have any insights? Is there something I need to be doing to redraw the input element?

---

Edit: Per Jeff B's request, and per the fact that this seems to have everybody stumped, here's some relevant bits of code:

 <script LANGUAGE="JavaScript" TYPE="text/javascript"> function changeText(changeSelector) { var myindex = document.getElementById(changeSelector+"Recent").selectedIndex; var SelValue = document.getElementById(changeSelector+"Recent").options[myindex].value; document.getElementById(changeSelector).value = SelValue; document.getElementById("historicalText").value = SelValue; document.getElementById("historicalTextSelect").value = changeSelector; } </script> <input onChange="updateScrollingPreview1217(this); return true;" type="text" id="crawlMsg1217" name="crawlMsg1217" size="60" maxlength="1000" value=""> <select id="crawlMsg1217Recent" name="crawlMsg1217Recent" onchange="javascript:changeText('crawlMsg1217');"> [options go here] </select> 

And that "onChange" handler isn't what's gumming up the works; I get the same behavior with or without it.

---

Edit 2: It looks like the problem is being caused by "JSpell", a third-party spelling checker our product uses. (I'm told that clients prefer using it to a spellcheck built into the browser; go figure.) It appears to be slightly misconfigured on my test machine, so I'm going to try straightening that out and praying that it makes the problems go away. If it doesn't ... should be interesting.

---

Edit 3: Yup. Fscking JSpell. Just posted a complete answer for the sake of posterity, will accept it tomorrow when I'm allowed. My thanks to everybody who tried to help; +1's all around, wish I could give more.

Answer 1

I have confirmed that the culprit is indeed JSpell, and that the precise trouble spot is this line:

window.onload=jspellInit;

Despite the prayers mentioned in Edit 2 above, making sure it was configured correctly did NOT make the problem go away. And this line is indispensable to JSpell's functionality. I don't know if JSpell always hoses Javascript functionality this way, or if there's some sort of perfect storm of factors that's causing it to pick a fight with my page, but that is indeed the source of my problems.

My thanks to everybody who tried to help. This was obviously a bit of a no-win in terms of getting the right answer, since it was caused by a component that was seemingly entirely unrelated and thus didn't get mentioned by me, but you at least confirmed that I was (in theory) doing things right and not simply going insane.

Answer 2

What does any other element on the page have a name attribute that is the same as the id?

Internet Explorer 8 and later. In IE8 mode, getElementById performs a case-sensitive match on the ID attribute only. In IE7 mode and previous modes, this method performs a case-insensitive match on both the ID and NAME attributes, which might produce unexpected results. - http://msdn.microsoft.com/en-us/library/ms536437%28VS.85%29.aspx

Try alerting your the nodeName and id ofr the returned element and make sure its the input you expect.

Answer 3

Is the document's id actually "textFieldID" or is "textFieldID" a javascript variable that contains the ID of the text input to change? If it is not a variable, I believe you should make it:

document.getElementById('textFieldID').value=newValue;

Answer 4

It's hard to debug this without the context, since the code you have ought to work fine. Can you confirm that you've got the right node by doing something like:

document.getElementById(textFieldID).style.border = "4px solid red";

Answer 5

Use div element instead of textfield. I had same problem, my textfield which is changed with another script wasnt get the right value. you can easily use any div element like textfield with some CSS. than you can get the value from div using innerHTML.