为什么onchange事件不起作用

时间:2015-11-17 14:23:11

标签: javascript html

为什么onchange事件不起作用? 下面是我的代码: php文件通常现在有问题。因为当我导航到只有de输入标签的其他数字时,它可以工作。但是当我用四个按钮导航时它不起作用。 谢谢你的回复!

    <script>
function splus() {
    document.getElementById("scene").value++;
    document.getElementById("take").value="1";
}
function smin() {
    if(document.getElementById('scene').value >1){
    document.getElementById("scene").value--;}
}
function tplus() {
    document.getElementById("take").value++;
    document.getElementById('comment').value = '';
}
function tmin() {
    if(document.getElementById('take').value >1){
    document.getElementById("take").value--;}
}
function change(scene,take) {
     if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("comment").innerHTML = xmlhttp.responseText;
            }
        };

        xmlhttp.open("GET","selectst.php?scene="+scene+"&take="+take,true);
        xmlhttp.send();
}
</script>
<body>
<button onclick="splus()" id="scene+">scene+</button>
<button onclick="smin()" id="scene-">scene-</button>
<button onclick="tplus()" id="take+">take+</button>
<button onclick="tmin()" id="take-">take-</button>
<input id="scene" type="number" onchange="change(this.value,document.getElementById('take').value)" value="1">
<input id="take" type="number" onchange="change(document.getElementById('scene').value,this.value)" value="1">
<textarea id="comment" rows="4" cols="50" placeholder="comments..."></textarea>
</body>

3 个答案:

答案 0 :(得分:0)

这是因为只有在与元素进行交互时才会触发change事件。如果您从javascript更改元素的值,则它不会触发它,您必须手动触发更改事件。您可以参考以下[MDN - post] /(https://developer.mozilla.org/en-US/docs/Web/Events/change)作为参考

答案 1 :(得分:0)

这是一种解决方法。我正在使用onfocus()。

function splus() {
  document.getElementById("scene").value++;
  document.getElementById("take").value = "1";
  document.getElementById("scene").focus();
}

function smin() {
  if (document.getElementById('scene').value > 1) {
    document.getElementById("scene").value--;
  }
  document.getElementById("scene").focus();
}

function tplus() {
  document.getElementById("take").value++;
  document.getElementById('comment').value = '';
  document.getElementById("take").focus();
}

function tmin() {
  if (document.getElementById('take').value > 1) {
    document.getElementById("take").value--;
  }
  document.getElementById("take").focus();
}

function change(scene, take) {
  alert("Clicked");
  if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
  } else {
    // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      document.getElementById("comment").innerHTML = xmlhttp.responseText;
    }
  };

  xmlhttp.open("GET", "selectst.php?scene=" + scene + "&take=" + take, true);
  xmlhttp.send();
}
<button onclick="splus()" id="scene+">scene+</button>
<button onclick="smin()" id="scene-">scene-</button>
<button onclick="tplus()" id="take+">take+</button>
<button onclick="tmin()" id="take-">take-</button>
<input id="scene" type="number" onfocus="change(this.value,document.getElementById('take').value)" value="1">
<input id="take" type="number" onfocus="change(document.getElementById('scene').value,this.value)" value="1">
<textarea id="comment" rows="4" cols="50" placeholder="comments..."></textarea>

答案 2 :(得分:0)

使用此解决方案:https://stackoverflow.com/a/2856602/5546267

<input onchange="alert('change !')" id="take" value="1"><br>
<button onclick="tplus()">run</button>
<regex>false</regex>