Question

我正在尝试使用一个按钮，单击此按钮可打开一个区域来键入消息。我在HTML中使用“onclick”，我希望它只能点击一次。我不想让它在点击它的时候继续制作更多的textarea。

在调用该函数的 onclick 之后，我有一个 this.onclick =“null”。这一直在进行，直到我添加了提交按钮。

所以这段代码可行：

HTML：

<html>
<head>
    <script type="text/javascript" src="js/question.js"></script>
    <style type="text/css">
        #container {
            position: absolute;
            height: 443px;
            width: 743px;
            border: 1px solid black;
            border-radius: 0 0 20px 0;
            margin-top: 75px;
        }
    </style>
</head>
<body>
    <div id="container"></div>
    <button id="new_message" onclick="createMessage(), this.onclick=null;">New Message</button>
</body>
</html>

使用Javascript：

function createMessage() {
    var form = document.createElement("form");
    form.name = "form_input";
    form.method = "POST";
    form.action = "messages.php";
    container.appendChild(form);

    var textarea = document.createElement("textarea");
    textarea.name = "message_input";
    textarea.cols = 84; 
    textarea.rows = 16; 
    textarea.id = "message_input"; 
    container.appendChild(textarea);
};

但是当我离开HTML时，将提交按钮添加到javascript中，如下所示：

function createMessage() {
    var form = document.createElement("form");
    form.name = "form_input";
    form.method = "POST";
    form.action = "messages.php";
    container.appendChild(form);

    var textarea = document.createElement("textarea");
    textarea.name = "message_input";
    textarea.cols = 84; 
    textarea.rows = 16; 
    textarea.id = "message_input"; 
    container.appendChild(textarea);

    var submit = document.createElement("button");
    submit.innerHTML = 'Send';
    submit.id = 'send_message';
    container.appendChild(submit); 
    submit.onClick(messageAjax());
};

它再次开始复制。有没有办法阻止这种幸福？

感谢您的帮助！

Answer 1

那是因为您的代码包含错误：

submit.onClick(messageAjax());

属性为onclick，小写。 onClick不存在并抛出错误。这可以防止按钮清除自己的onclick，因为错误导致脚本停止。

我不完全确定上面的那行应该是什么。它似乎是调用 messageAjax，然后立即将该函数的参数传递给submit.onClick ...您是否意味着这个？

submit.onclick = messageAjax;

Answer 2

也许：

(function() {

    var open = false;

    function createMessage() {

        if( open ) return;

        var form = document.createElement("form");
        form.name = "form_input";
        form.method = "POST";
        form.action = "messages.php";
        container.appendChild(form);

        var textarea = document.createElement("textarea");
        textarea.name = "message_input";
        textarea.cols = 84; 
        textarea.rows = 16; 
        textarea.id = "message_input"; 
        container.appendChild(textarea);

        var submit = document.createElement("button");
        submit.innerHTML = 'Send';
        submit.id = 'send_message';
        container.appendChild(submit); 
        submit.onClick(messageAjax());

        open = true;
    };

})();

闭包避免了与window.open（）的名称冲突。你可以用不同的名字命名，但它只是让你知道它。

如何让这个“onclick”不止一次发生？

2 个答案: