如何使用_layout.cshtml在視圖中使用javascript

Question

我有一個mvc 5項目。 在共享布局cshtml文件中，通常的javascript鏈接到jquery和bootstrap。

我有一個單獨的視圖，我將此代碼添加到：

<div class="test">
    @Html.CheckBoxFor(m => m.MyBool, new { @checked = "checked", onClick="toggleVisibility(this)" })
    @Html.LabelFor(m => m.MyBool)

</div>

<div id="content">
    my content
    @Html.TextBoxFor(m => m.MyText, new { id = "TextBoxA", style = "width:20px;" })
    <br />
    <p>
        Lorum ipsum
    </p>
    <p>
        Lorem Ispum
    </p>
</div>

單擊復選框后，我想在頁面上顯示或隱藏一些內容。 javascript就是這段代碼：

function toggleVisibility(cb) {
        var x = document.getElementById("content");
        if (cb.checked == true)
            //x.style.visibility = "visible"; // or x.style.display = "none";
            $("#content").show("fast");
        else
           // x.style.visibility = "hidden"; //or x.style.display = "block";
        $("#content").hide("fast");
    }

我遇到的問題是，如果我把這個javascript放在腳本標簽的共享文件中，我不能在我的視圖中使用該函數，但如果我在視圖本身使用它，我需要手動添加腳本鏈接到jquery捆綁在那里。 像這樣：

@Scripts.Render("~/bundles/jquery")
<script type="text/javascript" language="javascript">
    function toggleVisibility(cb) {
        var x = document.getElementById("content");
        if (cb.checked == true)
            //x.style.visibility = "visible"; // or x.style.display = "none";
            $("#content").show("fast");
        else
           // x.style.visibility = "hidden"; //or x.style.display = "block";
        $("#content").hide("fast");
    }
</script>

我想知道這是否正常，如果沒有，是否有解決方案。

Answer 1

你可以在這里使用部分

1.在視圖中創建一個部分。

 @section scripts{
 <script type="text/javascript" language="javascript">
function toggleVisibility(cb) {
    var x = document.getElementById("content");
    if (cb.checked == true)
        //x.style.visibility = "visible"; // or x.style.display = "none";
        $("#content").show("fast");
    else
       // x.style.visibility = "hidden"; //or x.style.display = "block";
    $("#content").hide("fast");
}
 </script>
}

2. 捆綁調用后，在_layout.cshtml中渲染部分。

   @RenderSection("scripts")