如何删除最初显示的innerHTML值

时间:2018-09-15 10:37:36

标签: javascript

我正在尝试在JavaScript中创建一个乘法表。提示用户提供表号(1到10),之后所有问号('?')都将替换为该表号。然后,用户需要在所有提供的文本字段中输入答案。最后,用户可以选择检查答案(即答案是否正确)。

运行代码时。输入用户数据进行提示后,它会在每个Incorrect的前面显示textfield,并且用户在Check answers按钮之前输入了值。我如何删除它们以使其最初显示。

输出: 我的代码:

function result() {
    var value = document.getElementById("a1").value;
    var checkMessageSpan1 = document.getElementById("checkMessage1");
    var checkMessageSpan2 = document.getElementById("checkMessage2");
    var r = x * 1;
    if (value == x) {
    checkMessageSpan1.innerHTML = "<span style=\"color:green\">"+"Correct!";
    }else{
    checkMessageSpan1.innerHTML = "<span style=\"color:red\">"+"Incorrect!";
    }



    var value = document.getElementById("a2").value;
    var r = x * 2;
    if (value == r) {
    checkMessageSpan2.innerHTML = "<span style=\"color:green\">"+"Correct!";
    }else{
    checkMessageSpan2.innerHTML = "<span style=\"color:red\">"+"Incorrect!";
    }


</script>
<button onClick="alert_field()"> Generate Question</button><br><br>

<p id="s1">
? x 1 = <input type="text"  id="a1"><span id="checkMessage1"></span><br>
? x 2 = <input type="text"  id="a2"><span id="checkMessage2"></span><br>

</p><br><br>
<p id="a"></p>

检查答案

2 个答案:

答案 0 :(得分:2)

要替换所有特殊字符,您可以利用js中的正则表达式 var res=str.replace(/[^a-zA-Z0-9]/g,x);代替 var res = str.replace("?",x);

有关JS https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions中的正则表达式的更多信息

答案 1 :(得分:1)

尝试添加此代码:

<dom-module id="foo-three">
  <template>
    <bar-element></bar-element>

     <foo-card hidden="[[bar]]">
       <slot name="header-content"></slot>

       <div id="addSlot" slot="card-content">
         <slot name="card-content"></slot>
       </div>

       <div slot="footer-action-right">
         <paper-button on-tap="_submitForm">Save</paper-button>
         <paper-button
           on-tap="_cancel"
           hidden$="[[hideCancel]]"
           slot="footer-action-right">
           Cancel
         </paper-button>

         <slot name="buttonn"><slot>
       </div>           

    </foo-card>
  </template>
</dom-module>