Question

我的最终范围是在点击后更改输入字段中的文本，然后用<div>容器替换<form>容器。

但表单创建后，点击事件不再被解雇。

在这个jfiddle中，我只发布了表单创建和函数来检查div上的火。有什么想法吗？

（任何提高代码可读性和效率的建议和评论总是被广泛接受，我是新手）。

斯特凡诺

代码：的 HTML

<body>
    <div id="pubbl">
        <div id="title"><h1>A sentence</h1></div>
        <div id="content">“Age is my alarm clock,” the old man said. “Why do old men wake so early? Is it to have one longer day?”
“I don’t know,” the boy said. “All I know is that young boys sleep late and hard”. Ernest Hemingway.</div>
    </div>
</body>
<button id="btn">show html</button>
<button id="cr">create form</button>

代码： JavaScript

$("#btn").click(function(){
    alert($("body").html());
    alert(there_is_form());
});

$("#cr").click(function(){
    crea_form();
});

$("#title").click(function(){
    alert("title fired");
});
$("#content").click(function(){
    alert("content fired");
});

function crea_form(){
    alert("function create form fired");
    if (there_is_form()) { return; };
    var test_div = document.getElementById('pubbl');
    var cont = test_div.innerHTML;
    test_div.innerHTML = '';    
    var form = test_div.appendChild(document.createElement('form'));
    form.name = 'input';
    form.action = 'target-etc';
    form.method = 'post';
    form.innerHTML = cont;
    input = form.appendChild(document.createElement('input'));
    input.type = 'submit';
    input.value = 'Submit';
};

function there_is_form(){
    return document.getElementsByTagName("form").length > 0;
};

Answer 1

试试这个，

$(function(){
    $(document).on('click',"#btn",function(){
        alert($("body").html());
        alert(there_is_form());
    });
    $(document).on('click',"#cr",function(){
        crea_form();
    });

    $(document).on('click',"#title",function(){
        alert("title fired");
    });
    $(document).on('click',"#content",function(){
        alert("content fired");
    });
});

阅读http://api.jquery.com/on

jQuery动态创建表单不允许在元素里面单击fire方法

1 个答案: