MVC部分视图和Javascript

我有一个基本上是一个小部件的部分视图。我想在同一页面上有1和'n'之间。MVC部分视图和Javascript

我遇到的问题是我无法获得JavaScript执行每一个。

例如

Index.cshtml

<div> 
    @Html.Partial("_ButtonPartialView") 
    <br/> 
    <br /> 
    @Html.Partial("_ButtonPartialView") 
</div>

_ButtonPartialView.cshtml

<h2>ButtonView</h2> 
<button id="foo"> 
    on 
</button>

BundleConfig.cs

bundles.Add(new ScriptBundle("~/bundles/test").Include(
         "~/Scripts/test.js"));

Layout.cshtml

@Scripts.Render("~/bundles/test")

test.js

$(document).ready(function() { 
    $('#foo').click (function() { 
     if ($('#foo').html() === 'on') { 
      $('#foo').html('off'); 
     } else { 
      $('#foo').html("on"); 
     } 
    }); 
});

我的问题是，当我点击它打开和关闭精细之间进行切换的第一个按钮。当我点击第二个按钮时，没有任何反应！

我更大的问题，如果我能得到这个工作是。我显然希望所有的部分视图都是独立的。例如我不想点击一个按钮，他们都会触发。他们都将被传递给一个模型，我需要编写JS来处理那些模型并显示信息。

所以每个小部件都需要独立。

感谢

来源

2017-02-13 Stuart

第一件事ID是唯一的，使用类，而不是用于按钮 – brykneval

正如在评论中提到的，id必须是唯一的。如果你想通过id引用按钮，你需要生成唯一的ID。

更简洁的方法是使用类选择器而不是$(this)来引用触发事件的按钮实例。

$(".foo").on("click", function(e) { 
    var btn = $(this); 
    var state = btn.html(); 
    ... 
});

来源

2017-02-13 17:56:07 Jasen

要触发脚本上动态添加的内容，您需要将事件绑定到文档。点击事件改变

$(document).on('click', '#foo', function() { 
    if ($('#foo').html() === 'on') { 
     $('#foo').html('off'); 
    } else { 
     $('#foo').html("on"); 
    } 
});

然后在对方的回答中提到改变选择是部分特定

来源

2017-02-13 18:12:24

MVC部分视图和Javascript

回答

相关问题