为啥我的 javascript 调用回发并且我没有错误？

Posted 2023-05-08

【中文标题】为啥我的 javascript 调用回发并且我没有错误？

【英文标题】：Why my javascript is calling a postback and i don't have error?为什么我的 javascript 调用回发并且我没有错误？

【发布时间】：2017-01-31 23:27:04

【问题描述】：

当我按下我的编辑按钮时，我调用了一个 webservice 函数，它返回一个问题参数列表，它正在工作，该函数为每个编辑按钮返回正确的值，但在返回值后，我有一个回帖和我的所有 html输入我填写的这个函数他们又清楚了，为什么？

javascript 和 jQuery：

$(document).ready(function () 
    $('.divPreview').on("click", ".editbtn", function () 
        var idQ = 0;

        idQ = $(this).val();
        var Did =  'Qid': idQ ;
        alert(idQ);

        $.ajax(
             type: "POST",
             async: false,
             url: "/WebService.asmx/GetQuestion",
             data: JSON.stringify(Did),
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             success: OnSuccess,
             error: function (r) 
                 alert(r.responseText);
             ,
             failure: function (r) 
                 alert(r.responseText);
             
        );

        function OnSuccess(response) 

            var question = response.d;

            $(".dropdown_fields").html('<select id="dplQuestionType" class="dropdown_selector"><option value="radio">Radio Button</option> <option value="checkbox">Check Box</option></select>');
            $(".input_field").html('<p>Q1:<input id="txtQuestion" type="text" /></p> <p> Answer Choices:</p><div><input id="hdnC1" type="hidden" value="0" /><input id="txtC1"type="text" name="mytext[]" /><input id="cbActive1" type="checkbox" /></div><div><input id="hdnC2" type="hidden" value="0" /><input id="txtC2" type="text" name="mytext[]" /><input id="cbActive2" type="checkbox" /></div>');
            $(".OtherOption").html('<input id="btnAddField" class="btnAddField" type="button" value="Add Choices"/><br>Page Number<input id="txtPageNumber" type="text" /> Question Order: <input id="txtOrder" type="text" /><br/><p><input id="cbCommonField" type="checkbox" />Add a Common Field</p><br/>Is Required<input id="cbIsRequire" type="checkbox" />Is Active<input id="cbIsActive" type="checkbox" /><br/>Hint:<textarea id="txtaHint" rows="2" cols="20"></textarea> ');
            $(".ButtonField").html('<p><input id="btnSave" type="button" value="Save" onclick="GetQuestionInfo()" />&nbsp;&nbsp;&nbsp;<input id="btnCancel" class="btnCancel" type="button" value="Cancel" /></p>');


            document.getElementById("btnAddQuest").style.visibility = 'hidden';
            document.getElementById("txtOrder").value = question.qst_Order;
            document.getElementById("txtPageNumber").value = question.qst_PageNumber;
            document.getElementById("cbIsRequire").value = question.qst_Order;
            document.getElementById("cbIsActive").value = question.qst_Order;
            document.getElementById("txtaHint").value = question.qst_Hint;
            document.getElementById("dplQuestionType").value = question.qst_Type;
            document.getElementById("hdnQuestionID").value = question.qst_Id;

            alert(question.qst_txt);
        
    );
);

【参考方案1】：

您实际上并没有执行 ajax 请求，您只是从表单执行正常的 post 请求，执行 ajax 请求会阻止使用 e.preventDefault(); 的默认提交

$('.divPreview').on("click", ".editbtn", function (e) 
e.preventDefault();