回車鍵功能在MVC5中無法正常工作？

Question

嗨我想通過在MVC5中按Enter鍵從一個字段導航到另一個字段。所以我用Enter鍵功能碼。下面提到的代碼。

我查看

<form> 
<fieldset> 
<legend></legend> 
<div class="col-sm-3"> 
<div class="form-group"> 
<span style="color: #f00">*</span> 
@Html.Label("Customer Name", new { @class = "control-label" }) 
@Html.ValidationMessageFor(model => model.CustomerName) 
@Html.TextBoxFor(model => model.CustomerName, new { @class = "form-control required", type = "text" }) 
    </div> 
    </div> 
<div class="col-sm-3"> 
<div class="form-group"> 
@Html.LabelFor(model => model.Alias, new { @class = "control-label" }) 
@Html.DropDownList("SalutationID", null, "Select", new { @class = "form-control" }) 
@Html.ValidationMessageFor(model => model.Alias) 
    </div> 
    </div> 
<div class="col-sm-3"> 
<div class="form-group"> 
<span style="color: #f00">*</span> 
@Html.Label("Customer Type", new { @class = "control-label" }) 
@Html.DropDownList("CustomerTypeID", null, "Select", new { @class = "form-control required" }) 
    </div> 
    </div> 
<hr style="width:100% ; align-self:baseline"> 
<h3 style="color: #0000FF">Address</h3> 
<div class="col-sm-3"> 
<div class="form-group"> 
<span style="color: #f00">*</span> 
@Html.Label("Address Type", new { @class = "control-label" }) 
@Html.DropDownList("AddressTypeID", null, "Select", new { @class = "form-control required" }) 
    </div> 
    </div> 
<div class="col-sm-3"> 
<div class="form-group"> 
<span style="color: #f00">*</span> 
@Html.LabelFor(model => model.Street, new { @class = "control-label" }) 
@Html.TextBoxFor(model => model.Street, new { @class = "form-control", type = "text required" }) 
@Html.ValidationMessageFor(model => model.Street) 
    </div> 
    </div> 
<div class="col-sm-3"> 
<div class="form-group"> 
@Html.LabelFor(model => model.Location, new { @class = "control-label" }) 
@Html.TextBoxFor(model => model.Location, new { @class = "form-control", type = "text " }) 
@Html.ValidationMessageFor(model => model.Location) 
    </div> 
    </div> 
<div class="col-sm-3"> 
<div class="form-group"> 
@Html.LabelFor(model => model.Place, new { @class = "control-label" }) 
@Html.TextBoxFor(model => model.Place, new { @class = "form-control", type = "text" }) 
@Html.ValidationMessageFor(model => model.Place) 
    </div> 
    </div> 
</fieldset> 
</form> 

我的jQuery代碼

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
<script type="text/javascript" src="./javascript.js"></script> 
<script 
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCJnj2nWoM86eU8Bq2G4lSNz3udIkZT4YY&sensor=false"> 
</script> 
<script type="text/javascript"> 
$("form:not(.filter) :visible:enabled:first").focus(); 
$('form > div').keypress(function(e) { 
    debugger; 
    if (e.keyCode == 13) { 
    e.preventDefault(); 
    if ($(this).next().length > 0) { 
    $(this).next().children('div').children(":not(label)").focus(); 
    } else { 
    $("form:not(.filter) :visible:enabled:first").focus(); 
    } 
    } 
}); 

我試過這個代碼。在這段代碼中，它顯示了接近下方插件的插件錯誤。

<script type="text/javascript" src="./javascript.js"></script> 

我試了很多辦法來消除這個插件錯誤，但沒有用。請任何人幫我解決這個問題。

高級謝謝..

Answer 1

看起來像jQuery沒有初始化。使用這樣的：

$(function() { 

$("form:not(.filter) :visible:enabled:first").focus(); 
$('form > div').keypress(function(e) { 
    debugger; 
    if (e.keyCode == 13) { 
    e.preventDefault(); 
    if ($(this).next().length > 0) { 
    $(this).next().children('div').children(":not(label)").focus(); 
    } else { 
    $("form:not(.filter) :visible:enabled:first").focus(); 
    } 
    } 
}); 

}); 

請注意，您的整個javascript代碼應在

$(function() 
{ 
//Your javascript goes here 
}); 

封裝的其他問題，我看到的是，你的本地JavaScript文件「javascript.js」路徑不正確。你將不得不糾正，加載你的JavaScript文件並擺脫404錯誤。 img.jpg文件也一樣。