使用MVC3 RAZOR View Engine執行JavaScript？

Question

我在MVC3 Razor View Engine中具有一個Index.cshtml頁面，其代碼如下：

@{
    ViewBag.Title = "Home Page";
}

<h2>@ViewBag.Message</h2>

<label id="lblClickMe" style="cursor:pointer"> Test Java Script Work in MVC Razor</label> || <label id="lblReset" style="cursor:pointer"> Rest    </label>

<br /><br /><br /><br />
<input type="text" id="txtResult"  style="width:300px"/>

我在Sane頁面中有一些JavaScript，例如：

<script type="text/javascript">
    $("#lblClickMe").click(function () {

        var txtResukt = document.getElementById("txtResult");
        txtResukt.value = "Java script work successfully";

    })

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

        var txtResukt = document.getElementById("txtResult");
        txtResukt.value = "";

    })
</script>

當我嘗試加載我的視圖時，請從“ lblClickMe”點擊事件中獲取以下異常：

Microsoft JScript runtime error: Object expected

有人修復此錯誤嗎？

Answer 1

嘗試這個：

  <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
    <script type="text/javascript">
        $("#lblClickMe").click(function () {
         $("#txtResult").val("Java script work successfully");
        });
        $("#lblReset").click(function () {
          $("#txtResult").val("");
        });
    </script>

Answer 2

嘗試這個：

$(document).ready(function()
{
    $("#lblClickMe").click(function () { 

        var txtResukt = document.getElementById("txtResult"); 
        txtResukt.value = "Java script work successfully"; 

    }) 

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

        var txtResukt = document.getElementById("txtResult"); 
        txtResukt.value = ""; 

    }) 

});   

這樣可以確保在代碼嘗試連接click事件之前，先加載頁面中的HTML。

Answer 3

為什么不這樣做呢？

$("#lblClickMe").click(function () {
    document.getElementById("txtResult").value = "Java script work successfully";
});

或在純jQuery中：

$("#lblClickMe").click(function () {
    $("#txtResult").val("Java script work successfully");
});