Question

我有一些问题。我有一个带有一个隐藏输入元素的html表单。我的javascript代码中有一个数组。我想抓住按下提交按钮事件（通过使用jquery）并将数组数据推送到隐藏输入中。

问题是 - 首先发生什么：表单日期将流向.php脚本或javascript的数组将被推入隐藏的输入和后面的.php脚本将被调用？为什么会这样呢？

TIA！

upd（代码示例）：

...
// process $_POST['domains']
...

<form action="registration?id=reg" method="post" enctype="multipart/form-data" id="reg_form">
    ...
    <input type="hidden" id="domains" name="domains[]" value=""/>
    ...
    <input type="submit" name="go" value="Register"/>
</form>

<script type="text/javascript">
    var domainlist = [];

    Array.prototype.indexOf = function (name) {
        var ind = -1;
        for (var i = 0; i < this.length; i++) {
            if (this[i].name == name) {
                ind = i;
                break;
            }
        }
        return ind;
    }

    $(document).ready(function() {
        ...
    });

    function checkDomain() {
        ...
            req = $.ajax({
                type:           'post',
                cache:          false,
                url:            'ajax.php',
                data:           ...,
                success: function(data) {
                    $('#domain_list_wrap').delegate('input:checkbox', 'click', function () {
                        var dmnName = $(this).attr('name');
                        domainlist.push({name: dmnName, cost: domainsArr[dmnName.split('.')[1]]});
                        ...
                    });
                    $('#domain_cart').delegate('input:checkbox', 'click', function () {
                        domainlist.splice(domainlist.indexOf($(this).attr('name')), 1);
                        ...
                    });
                }
            });
        ...
    }
</script>

Answer 1

在提交表单时会触发JavaScript submit事件，但在向服务器发出请求之前（因为JavaScript在客户端运行，这非常有意义）。因此，您想象它的工作方式应该没问题，您可以使用jQuery绑定到表单提交事件，如下所示：

$("#yourForm").submit(function() {
    //Submit event handler will run on form submit
});

submit事件处理程序也可用于通过返回false来取消表单提交（例如，如果某些验证失败）。如果首先将数据发送到服务器，它将无法正常工作！

Answer 2

把它放在你的身上

<form id="frm" method="post" action="/">
    <input type="hidden" id="txtHidden" />
    <input type="submit" id="btnSubmit" value="submit" />
</form>

这就在你脑海中：

<script type="text/javascript">
    var arr = [ "hello", "there", "world" ];

    $(document).ready( function() {
        $("#btnSubmit").click( function(event) {
                   var str = arr.join(",");
                   $("#txtHidden").val(str);
                   // make sure the value is in the field
                   alert($("#txtHidden").val());
            });
    });

</script>

当你点击btnSubmit时，数组将以逗号连接，你会看到警告，然后表格将被提交。

提交按钮上的Javascript

2 个答案: