Question

在PHP程序的Web表单中，表单是常规HTML表单。

现在，表单有3个单独的文本框。让他们的ID /名称分别为box1，box2和box3

我希望发生的是，当表单发布时 -

发布以下文字 - ＆gt; box1 + box2 + box3内容，以逗号分隔。

我希望使用JQuery这样做 - 我查找了JQuery“提交”功能，但找不到任何直接的方法来替换参数 - 我该如何实现上述功能？

Answer 1

你可以这样做：

$('#yourForm').submit(function(e){

    var form = $(this)

    //Do you validation

    if(isValid){
        var mergedInput = $('<input/>');
        var inputToMerge = ['#box1','#box2','#box3'];
        var valueToMerge = $.map(inputToMerge, function(selector){
            val = $(selector).val()
            $(selector).remove()
            return val;
        })
        mergedInput.val(valueToMerge.join(','));
        mergedInput.prop('name', 'mergedInput')


        mergedInput.appendTo(form);

    }else{
        return false;
    }
})

基本上，它正在将您的输入合并到一个可通过php访问的['mergedInput']。

Answer 2

我认为您可以使用ajax轻松完成此操作..请检查Change contents of submitted form on submit

如果你想在没有ajax的情况下这样做，你可能必须使用隐藏字段..请检查jquery-add-additional-parameters-on-submit-not-ajax

Answer 3

您可以使用AJAX解决问题

您的HTML

<form onsubmit="return sendBoxes()">
  <input type="text" id="box1">
  <input type="text" id="box1">
  <input type="text" id="box1">
  <input type="submit">
</form>

和JS

function sendBoxes(){
    var values = "'"+$('#box1').val()+"'"+$('#box2').val()+"'"+$('#box3').val()+"'";
    jQuery.ajax({
       url: "ajax_ajax.php",
       data: "boxes="+values,
       cache: false,
       error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("Error.\n" + textStatus + " " + errorThrown);
       }
    });
    return false;
}

Answer 4

HTML

 <input id="box1" type="text" />
 <input id="box2" type="text" />
 <input id="box3" type="text" />
 <input id="submit_button" type="submit" />

JS

function submit(){
$.ajax({
  type: "POST",
  url: "someurl.php",
  data:{'boxes':$('#box1').val()+","+$('#box2').val()+","+$('#box3').val()}
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});
}
$("#submit_button").click(function(e) {
  submit();
  e.preventDefault();
  return false;
});

这将检查是否单击了提交按钮并发送三个以逗号分隔的框值

jquery代码，用于更改表单提交的参数

4 个答案: