Question

我有以下功能：

// open a new window. Create and submit form
function createSubmitForm(response) {
    var external = window.open('about:blank', 'external');
    var doc = external.document;
    var body = $('body', doc);

    // create a new form element
    var form = $("<form id='authForm'></form>");
    // set the form's attributes and add to iframe
    form.attr("action", response.action)
        .attr("method", response.method);
    form.appendTo(body);

    // create form elements;
    for (var i = 0, len = response.fields.length; i < len; i++) {
        var field = response.fields[i];

        if (field.name != "") {
            $("<input type='hidden'/>")
                .attr("name", field.name)
                .attr("value", field.value)
                .appendTo(form);
        }
    }
    // submit the form
    form.submit();
}

当我尝试执行它时，我在form.appendTo(body)得到“未指定错误”。

我在这里做错了什么？

Answer 1

如果要在新窗口中书写，请使用document.write。您的工作方式不适用于所有浏览器。

Answer 2

试试这个：
请注意，您的服务器上必须有空白页http://localhost/some-blank-page-on-your-server.php

<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
</style>
</head>
<body>

</body>
<script>
(function($) {
$(function() {
    // open a new window. Create and submit form
    function createSubmitForm(response) {
        var external = window.open('http://localhost/some-blank-page-on-your-server.php', 'external');
setTimeout(function() {
        var doc = external.document;
        var body = $('body', doc);

        // create a new form element
        var form = $("<form id='authForm'></form>");
        // set the form's attributes and add to iframe
        form.attr("action", response.action)
            .attr("method", response.method);


        // create form elements;
        for (var i = 0, len = response.fields.length; i < len; i++) {
            var field = response.fields[i];

            if ( field.name !== "" ) {
                $("<input type='text'/>")
                    .attr("name", field.name)
                    .attr("value", field.value)
                    .appendTo(form);
            }
            $("<input type='submit' value='submit' />").appendTo(form);
        }
        // submit the form
        form.submit();

        body.append(form);
}, 1000);
    }

    createSubmitForm({
      action: 'http://www.example.com',
      method: 'get',
      fields: [{
        name: 'field1',
        value: 'some value'
      }]
    });
});
})(jQuery);
</script>
</html>

Answer 3

尝试使用jquery在附加

时定义表单

$（形式）.appendTo（主体）;

Answer 4

我认为更简单的方法是使用jquery UI dialog

Answer 5

我会在appendTo之前抛出一个警告（表单），只是为了看看该页面认为表单变量是什么。

帮助查明问题的另一个选项是在firefox中加载firebug并使用它来调试问题。作为一个快速测试，我会摆脱camelcase，因为我之前有过实例，即使它应该是camelcase它只有在全部小写的情况下才有效。通常这是在IE中。傻，但这是一个快速检查。

如何在新窗口中创建HTML表单

5 个答案: