如何指定js和css文件到一个特定的局部视图，而不会干扰到同一页面上的另一个局部视图

本文关键字：视图 干扰 另一个局 一页 局部 css 文件 js 何指定 一个 | 更新日期: 2023-09-27 17:50:42

我在页面上有两个部分视图，每个部分在js和css中都有类似的信息，但我不希望js或css相互作用。这在MVC中可能吗?

如何指定js和css文件到一个特定的局部视图，而不会干扰到同一页面上的另一个局部视图

我也有同样的问题。我正在使用第三方商业库来弹出窗口对话框，在那里我可能有一个重复使用的部分页面，也包含相同的id字段。

(假设它们是客户，您有一个带有CustomerID的订单弹出窗口，以及一个带有CustomerID的客户弹出窗口)

我真的必须了解我使用的商业库是如何工作的，但是我能够告诉它，在某些选项中，它使用了iframe(而不仅仅是移动一个div)。但是当设置选项时，它使用iframe，当然我的问题就消失了-因为这些真的是单独的页面，javascript只会弥合差距，如果你尝试。

所以，最终，使用帧通常是我最后的手段，但是没有更简单的方法来显示两个部分视图，并且轻微地沙箱化，以免导致彼此的id错误。

为了避免使用iframe，你仍然可以有两个表单发布相同的字段名，但避免JavaScript错误，如果他们有不同的id。你还可以做一些小的修改，使css选择器不匹配两个表单。

下面是解释这个想法的伪代码:

<script type="text/css">
  form.customer > input { border: 1px solid red; }
  form.order > input { border: 3px dotted blue; }
</script>
<script type="text/JavaScript">
function doSomething()
{
    CustomerId_Customer.text = "1";
}
</script>
<form class="customer" action="/Customer/Save">
<input type="text" name="CustomerId" id="CustomerId_Customer" />
</form>    
<script type="text/JavaScript">
function doSomethingElse()
{
    CustomerId_Order.text = "3";
}
</script>       
<form class="order" action="/Order/Save">
<input type="text" name="CustomerId" id="CustomerId_Order" />
</form>
<a href="javascript:doSomething();"> Do Something</a>    
<a href="javascript:doSomethingElse();"> Do Something Else</a>

注意，这需要对原始的部分视图进行各种更改。同样，如果你想用一个神奇的标签来包装它们，解决所有的问题……然后是iframes

相关文章：