8

好吧,我有这段代码:

<input id="CI.SiteName" type="text" value="" name="@@CI.SiteName" disabled="">

然后我做了一些会调用这个函数的事件:

chooseSite = function () {
    var url = "/main/Ajax/GetSiteDetail?" +
        "&cid=" + escape(idSite);

    var ajx = sendAJAX(url, true);

    ajx.onreadystatechange = function () {
        if (ajx.readyState == 4) {
            var result = ajx.responseText;      
            result = "TOP";
            document.getElementById("CI.SiteName").value = result;
        }   
    }
}

在浏览器中它更改为“TOP”,但是当我用 firebug 检查元素时,INPUT 的 VALUE 属性仍然“”,没有改变。

4

2 回答 2

22

value 属性与实际值不同步;这就是该value 物业的用途。

这不是问题,因为您永远不会使用.getAttribute('value')但使用该属性.value来访问当前值。

于 2012-04-27T07:29:28.237 回答
0

<!DOCTYPE html>
<html>

<head>
  <title>Test</title>
  <meta charset="UTF-8" />
</head>

<body>
  <div id="app"></div>
  <div id="buttons">
    <button id="1" data-text="one">1</button>
    <button id="2" data-text="two">2</button>
    <button id="3" data-text="three">3</button>
    <button id="4" data-text="four">4</button>
    <button id="5" data-text="five">5</button>
    <input id="inp" value=""></input>
  </div>

  <script>
    const onClick = function() {

      var dataTextBtnField = this.getAttribute("data-text");
      var currentData = document.getElementById("inp").value

      var showValue = currentData + dataTextBtnField
      document.getElementById("inp").setAttribute("value", showValue);
      document.getElementById("inp").value = showValue;
    }

    const onChange = function() {
      this.setAttribute("value", this.value);
    }

    document.getElementById('1').onclick = onClick;
    document.getElementById('2').onclick = onClick;
    document.getElementById('3').onclick = onClick;
    document.getElementById('4').onclick = onClick;
    document.getElementById('5').onclick = onClick;
    document.getElementById('inp').onchange = onChange;
  </script>

</body>

</html>

document.getElementById("inp").setAttribute("value", showValue);

使用它只会改变 HTML 代码,不会反映在视图中。

document.getElementById("inp").value = showValue;

使用它只会在视图中更改,而不会在代码中更改。

使用两条线在两个位置进行更改。

评论附加片段中的上述行以观察相同的内容。

于 2021-09-26T18:51:56.407 回答