Question

我有一个javascript函数可以更改表单上的某些字段，我有两个按钮，一个用于调用javascript函数，另一个用于提交表单。问题是调用javascript函数的按钮提交表单。我已经尝试将按钮类型更改为“按钮”，它会按下按钮并且不起作用。

 $("#button1").click(function () {

        //$("#usernameField").attr("value","");
        //$("#passwordField").attr("value","");


        if (authType == 0) {

            $("#usernameLabel").hide();
            $("#usernameField").hide().find('input:text').val("");

            $("#passwordLabel").hide();
            $("#passwordField").hide().find('input:text').val("");

            //$("#initialCatalogLabel").show();
            //$("#initialCatalogField").show();

            document.getElementById("button1").textContent = "Intergrated";
            $('#authType').val(1);


        }
        else {

            $("#usernameLabel").show();
            $("#usernameField").show();
            $("#passwordLabel").show();
            $("#passwordField").show();
            //$("#initialCatalogLabel").hide();
            //$("#initialCatalogField").hide();

            document.getElementById("button1").textContent = "SQL Authentication";
            $('#authType').val(0);
            //return false;

        }


<h2>Create</h2>


@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)


<fieldset>
    <legend>connection</legend>
   <div class="editor-label">
       Authentication Type
   </div>
   <div>
      <button id="button1" value="Intergrated" name="intergrated">SQL Authentication</button>
   </div>
   <br />
   <br />

    <div class="editor-label">
        Connection Name
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.conName)
        @Html.ValidationMessageFor(model => model.conName)
    </div>
    <div class="editor-label">
       Data Source
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.dataSource)
        @Html.ValidationMessageFor(model => model.dataSource)
    </div>
     <div class="editor-label" id="initialCatalogLabel">
       Initial Catalog
    </div>
    <div class="editor-field" id="initialCatalogField"> 
        @Html.EditorFor(model => model.initialCatalog) 
        @Html.ValidationMessageFor(model => model.initialCatalog)
    </div>

    <div class="editor-label" id = "usernameLabel">
       Username
    </div>
    <div class="editor-field" id="usernameField">
       @Html.EditorFor(model => model.username)
        @Html.ValidationMessageFor(model => model.username)
    </div>
    <div class="editor-label" id = "passwordLabel">
       Password
    </div>
    <div class="editor-field" id = "passwordField">
        @Html.EditorFor(model => model.password)
        @Html.ValidationMessageFor(model => model.password)
    </div>
    <div>
        <input type="hidden" name="authType" id="authType" value="@Model.authType" />
    </div>


   <p>
        <input type="submit" value="Create"/>
        @{
if (!string.IsNullOrEmpty(ViewBag.error))
{
                <div style="color:Red">
                   @ViewBag.error 
                </div>           
}
        }
    </p>

</fieldset>

}

Answer 1

 <input type="button" id="button1" value="Integrated" />

您尝试过的按钮类型可能不对吗？

Answer 2

您需要定位表单，而不是按钮

使用jquery时无需使用e.preventDefault();。

$('form').submit(function(e){
    return false;
});

HTML按钮提交表单

2 个答案: