Question

在母版页面中，我有这个......

<ul id="productList">
  <li id="product_a" class="active">
    <a href="">Product A</a>
  </li>
  <li id="product_b">
    <a href="">Product B</a>
  </li>
  <li id="product_c">
    <a href="">Product C</a>
  </li>                    
</ul>

我需要更改所选列表项的类... 单击“产品A”时，它将获得“活动”类，而其他类则不会。当点击“产品B”时，它会获得“活动”类，而其他类则不会。我试图在家庭控制器中执行此操作，但我很难获得对页面或其任何元素的引用。

Answer 1

我很难获得对页面或其任何元素的引用。

听起来你并没有真正获得MVC。您的控制器不应该引用视图的html元素。您需要创建一个模型（在这种情况下可能是一个视图模型），其中包含产品列表并指出选择了哪个。然后，您的视图只是将视图模型的内容显示为HTML。它可能包括模型中产品的循环，并检查Active属性。

Answer 2

您无法从控制器访问HTML。您需要在Javascript中执行此操作，或刷新页面重新生成HTML（例如，使用不同的查询字符串参数发布到同一页面）。然后在您的控制器中，您可以指定选择了哪个项目，然后在生成列表时在视图中，检查选中并将类放在其上。

Answer 3

您可以在模型中具有与列表项的ID对应的id字段。检查当前模型是否与列表项的id匹配。如果是，则设置活动类。

Answer 4

你可以通过几种方式做到这一点。简单的方法是确保链接URL与它所访问的页面匹配。然后，您可以定义锚标记的活动状态，CSS将负责其余部分。如果所有链接都指向同一个URL，则这将无法正常工作，在这种情况下，您可以通过让控制器向视图传递活动链接的ID来控制状态。然后，当您遍历正在构建的列表时，可以将ViewData中的ID与您迭代的ID进行匹配。当您找到要查找的那个时，可以手动将类设置为“活动”。旧学校的方式......但是有效！

Answer 5

假设您在询问ASP.NET MVC，尝试在控制器中执行此操作的目的是什么？

正如Max所说，你可以使用JavaScript来做到这一点，这将是最简单和最有效的。

Answer 6

经过测试。

<html>
    <style type="text/css">
    a:active
    {
       color="green";
    }
    </style>

   <ul id="productList">
      <li id="product_a" class="active" onclick="setActive(this)">
        <a href="">Product A</a>
      </li>
      <li id="product_b">
        <a href="" onclick="setActive(this)">Product B</a>
      </li>
      <li id="product_c">
        <a href="" onclick="setActive(this)">Product C</a>
      </li>                    
    </ul>

    <script type="text/javascript">
        function setActive(obj) {
          aObj = document.getElementById('productList').getElementsByTagName('li');
          for(i=0;i<aObj.length;i++) {
            if(aObj[i].name == obj.name) {
              aObj[i].className='active';
            } else {
              aObj[i].className='';
            }
          }
        }
    </script>
</html>

Answer 7

您可以使用

）ViewData [“ddlList”]，new {@class =“hello”，className =“asdfasdf”，anyproperty =“putsometext”}）％＆gt;

请参阅文章：http://altafkhatri.com/Technical/Assign_css_class_to_MVC_dropdownlist了解更多详情

如何在MVC中设置HTML元素的样式/类？

7 个答案: