javascript - 如何使用 MooTools 设置文本输入的值

Answer 1

Are you sure the value isn't being set?

What do you get when you call: input.get('value')

I tested this (in firefox) and even though the console just logs <input type=​"text"> the value does in fact get set. Try adding the element to the page and you'll see it :)

Answer 2

I've had a similar problem with this 'red herring' which I've since solved, and thought I'd share. I'm trying to make certain cells of a table row editable when the user clicks on the row:

var cells = this.getElements("td");
for (var ix=0;ix<cells.length; ix++){
   if (cells[ix].hasClass("edType_text")){
      var celltext = cells[ix].get("text");
      cells[ix].set('text','');
      var editTag = new Element ('input',{type:'text','value':celltext});
      editTag.inject(cells[ix]); 
   }
}

This seemed to work OK but when I clicked on the cell I couldn't edit it. Firebug and Chrome tools showed the added input tag as

<input type='text'>

instead of the expected:

<input type='text' value='xxxxxx' />

However this is perfectly normal as commented on above.

Spotted the 'deliberate' error ?

Of course when I clicked on the input field it triggered the mouse event on the row again, thus preventing me getting at the input!!!! :-{

To avoid this just add this line of code at the end of the if block:

editTag.addEvent("mousedown",function(event){event.stopPropagation();});