Question

我有这个HTML格式：

<form role="form"  id="testForm" action="/lancerTest" method=post>

                    <div class="form-group has-success">
                        <label class="control-label" for="inputSuccess">Input with success</label>
                        <input type="text" class="form-control" id="inputSuccess">
                    </div>

                    <div class="form-group has-warning">
                        <label class="control-label" for="inputWarning">Input with warning</label>
                        <input type="text" class="form-control" id="inputWarning">
                    </div>

                    <div class="form-group has-error">
                        <label class="control-label" for="inputError">Input with error</label>
                        <input type="text" class="form-control" id="inputError">
                    </div>
<button type="submit" class="btn btn-primary" id="btntest">Lancer le test</button>
                </form>

我想在提交此表单之前执行一些操作，因此我使用了以下代码：

 $('#testForm').submit(function() {
$('#loading').show();
var htmlOutput = $('#testForm').html();

newcontnent="<fieldset disabled>"+htmlOutput+"</fieldset>";
$('#testForm').html(newcontnent);


    return true; 
});

但是在提交此表单时，所有输入的值都已丢失（我认为，因为我在提交之前编辑了表单的html代码）。那么，我该如何解决这个问题？

Answer 1

更好地使用click事件，阻止默认操作，执行您的操作，然后提交表单：

$('#your-submit-button').click(function (event) {
    event.preventDefault();

    // your stuff

    $('#your-form').submit();
});

Answer 2

从按钮

中删除type =“submit”

   $('#btntest').click(function () {

 // your treatment

  var inputSuccess=$('#inputSuccess').val(); 
  var inputWarning=$('#inputWarning').val();
  var inputError=$('#inputError').val();

 // you can send data with post method

 $.post('url_page.php',{inputSuccess:inputSuccess,inputWarning:inputWarning,
  inputError:inputError},function(){

});

});

在提交之前编辑表单的HTML代码并保存输入的值

2 个答案: