JQuery:Form元素中的appendTo()不起作用

时间:2015-07-07 15:06:44

标签: jquery appendto

我正在尝试创建一个页面,其中用户在三个单独的文本区域中输入的文本将被提取并插入到单击按钮时生成的第四个文本区域中。目前我正在试验一个简单的版本,并且由于某种原因,当点击“生成”按钮时,无法生成这个额外的文本区域。最令我困惑的是,如果我注释掉< 表单>它会正常工作和< / form >元素!

<!DOCTYPE html>
        <html>
        <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <script  src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script>
            $(document).ready(function(){
                $("#b1").on("click", function(){
                    $("<div><textarea>come on</textarea></div>").appendTo("#why");
                });
            });
            </script>
        </head>
        <body>
            <form action="">
                <div id="why">
                    <textarea name="IWant">why.</textarea>
                </div>
                <div id="what">
                    <textarea name="IWant">what.</textarea>
                </div>
                <div>
                    <button id="b1" type="submit">Generate</button>
                </div>
            </form>
        </body>
        </html>

2 个答案:

答案 0 :(得分:1)

在您的上下文中使用 event.preventDefault()。它会阻止默认操作,否则您的页面应该被重定向

$("#b1").on("click", function(event){
    event.preventDefault();
    $("<div><textarea>come on</textarea></div>").appendTo("#why");
});

Fiddle

答案 1 :(得分:0)

您的write.dbf(MyDF,MyDF.dbf,factor2char = F) 按钮将在(成功)附加元素后非常快速地提交表单。阻止使用submit

提交表单
preventDefault()

http://jsfiddle.net/pL3L2not/

相关问题