0

クリックすると、メッセージを入力するための領域が開くボタンを作成しようとしています。HTMLで「onclick」を使用していますが、一度だけクリックできるようにしたいです。クリックすればするほど、テキストエリアを増やし続けたくありません。

関数を呼び出す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());
}; 

再び重複し始めます。これが起こらないようにする方法はありますか?

ご協力いただきありがとうございます!

4

2 に答える 2

0

これは、コードにエラーが含まれているためです。

submit.onClick(messageAjax());

プロパティはonclick小文字の , です。onClick存在せず、エラーをスローします。これにより、エラーによってスクリプトが停止するため、ボタン自体onclickがクリアされなくなります。

上記の行がどうあるべきか完全にはわかりません。を呼び出し て、すぐにその関数の引数を...messageAjaxに渡しているようです。submit.onClick

submit.onclick = messageAjax;
于 2013-09-07T23:58:39.200 に答える
0

多分 :

(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() との名前の競合を回避します。別の名前を付けることもできますが、知っているだけです。

于 2013-09-07T23:59:30.213 に答える