onClick事件不适用于按钮

Question

我正在尝试根据单击的按钮显示表单。 即，在单击第一个按钮时，将显示另外两个按钮。 但是，生成的新按钮的行为类似于虚拟按钮（ onClick事件不起作用）。

如何解决此错误？ 有没有其他选择可以实现相同的功能？

我有以下代码：

<html>
<head>
    <title>Frequently Asked Questions</title>
    <link rel="stylesheet" type="text/css" href="CSSfiles/faqCSS.css">  
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script >
        function addContent(divName, content) {
            document.getElementById(divName).innerHTML = content;
        }
    </script>
</head>
<body>
    <p>Put banner and logo on top; Put footer later </p>
    <div class="intro">
        Looking for help? We provide you information about what can be done when in trouble. Hope you find it helpful!
    </div>


    <form name="myForm" class="select">
        <input type="button" value="ND" class="select-button" onClick="addContent('myDiv', document.myForm1.ND.value);"><br>
        <input type="button" value="E" class="select-button" onClick="addContent('myDiv', document.myForm1.E.value);">
    </form>

    <form name="myForm1" class="select">
        <textarea   name="ND">
            <input type="button" value="Earthquakes" class="trial" onclick="addContent('yourDiv', document.myForm2.HW.value);"/><br>
        </textarea>
        <textarea  name="E"><u>E</u></textarea>
    </form>

    <form name="myForm2" class="select">
        <textarea   name="HW">
            <u>Hello world!</u>
        </textarea>
    </form>

    <br><br>

    <div id="myDiv"></div>
    <div id="yourDiv"></div>
</body>
</html>

Answer 1

我不清楚如何将按钮添加到DOM（您可以发布该代码吗？）。

但是，假设您的按钮的ID为“ MyButton1”，

 <button id="MyButton1">Hello</button>

然后， 如果您使用jQuery进行此操作 ，则代码需要通过钩住一个已经存在并将包含您的按钮的对象，来委派单击。 例如body元素：

// This is registered before MyButton1 is created.

$('body').on('click', '#MyButton1', function(event) {
    alert("Hello, I'm button 1");
}

使用普通的JavaScript，你已经创造了新的内容之后（这样getElementById可以找到的按钮），您需要onclick事件绑定：

document.getElementById('MyButton1').onclick = function() {
    alert("Hello again");
}

或（旧版IE不支持）

document.getElementById('MyButton1').addEventListener("click",
   function() {
       alert("Still me");
   });

在这里，您可以找到带有代码re：javascript方法的Javascript提琴 。

Answer 2

最初将所有表单隐藏。 将它们放在所需的分区中。 每个按钮的onclick仅显示/隐藏预期的表格。

这可以帮助您。

onClick事件不适用于按钮

问题描述

2 个解决方案

解决方案1
0 2015-03-13 13:43:12

解决方案2
-1 2015-03-13 13:05:54

onClick事件不适用于按钮

问题描述

2 个解决方案

解决方案1 0 2015-03-13 13:43:12

解决方案2 -1 2015-03-13 13:05:54

解决方案1
0 2015-03-13 13:43:12

解决方案2
-1 2015-03-13 13:05:54