js-html-类型化的文本框值未在属性中设置？

Question

研究员，
我写了一些代码来保存网页的当前状态。 当有一个文本框可以通过输入更改值时，该更改未记录在html代码中。 即使我打电话给：

object.value = 'x';

是不会更改值。 当我使用时：

object.setAttribute('value','x');

然后将更改注册到html代码中。

循环遍历文本框设置onchange属性不是解决方案，因为我有一些特殊的文本框已经设置了onchange属性。

谢谢你的帮助

function SaveHTML()
{
removeThis(get('Source'));
var newdiv = document.createElement('div');
newdiv.setAttribute('id','Source');
newdiv.style.position= 'absolute';
newdiv.style.top= (tempY-200)+'px';
newdiv.style.left= (tempX+30)+'px';
newdiv.style.backgroundColor = 'white';
var html=encodeURI(document.getElementsByTagName('body')[0].innerHTML);
newdiv.innerHTML='HTML:<br><textarea rows="20" cols="60">'+html+'</textarea><br><input type=button value=close onclick=removeParent(this)>';
document.body.appendChild(newdiv);
}

function LoadHTML()
{
removeThis(get('Source'));
var newdiv = document.createElement('div');
newdiv.setAttribute('id','Source');
newdiv.style.position= 'absolute';
newdiv.style.top= (tempY-200)+'px';
newdiv.style.left= (tempX+30)+'px';
newdiv.style.backgroundColor = 'white';
newdiv.innerHTML='HTML:<br><textarea id=code rows="20" cols="60"></textarea><br><input type=button value=cancel onclick=removeParent(this)> <input type=button value=load onclick=document.getElementsByTagName(\'body\')[0].innerHTML=decodeURI(get(\'code\').value)>';
document.body.appendChild(newdiv);
}

function get(Element)
{
return document.getElementById(Element);
}

function removeThis(obj)
{ 
try{
obj.parentNode.removeChild(obj);
}
catch (e) {
    return;
}
}

function removeParent(obj)
{
obj.parentNode.parentNode.removeChild(obj.parentNode);
}

Answer 1

嗯，很奇怪。 我不希望它有这种行为。 有趣。

您可以在保存HTML时遍历每个输入字段，然后执行

object.setAttribute("value", object.value)

？

您还可以使用大型框架的事件处理功能之一，它们可以附加事件而不会覆盖旧事件。

Answer 2

setAttribute和getAttribute不应使用，因为它们不是标准的，使用.value应该可以。 但是另一种方法是使用jQuery的attr方法。

$('#myID').attr('id', 'newID');
$('#myID').attr('value', 'newValue');

另外，您应该使用如下正确的引号：

newdiv.innerHTML='HTML:<br><textarea rows="20" cols="60">'+html+'</textarea><br><input type="button" value="close" onclick="removeParent(this)">';

和

newdiv.innerHTML='HTML:<br><textarea id="code" rows="20" cols="60"></textarea><br><input type="button" value="cancel" onclick="removeParent(this)"> <input type="button" value="load" onclick="document.getElementsByTagName(\'body\')[0].innerHTML=decodeURI(get(\'code\').value)">';

要为特定的事物设置onchange，请尝试使用jQuery选择器：

$('#myID').onchange(function(){/* your stuff here */});

Answer 3

在SaveHTML调用中，我运行此功能。 奇迹般有效！

function TouchInputs()
{
var everything = document.getElementsByTagName('input');
var everythinglength = everything.length;
for(var i = 0;i<everythinglength;i++)
    {
        try{
            everything[i].setAttribute('value',everything[i].value);
        }
        catch(e){
                alert(e.message);
            }
    }
}