Question

我在页面上有一个DropDownList和一个TextBox。当用户在DropDownList中选择“其他”选项时，我想在其右侧显示一个TextBox。我不想使用传统的PostBack技术。我希望这种互动是客户端。

我知道我可以获得对DOM元素的引用并将其样式设置为“display：none”或“display：”。我正在寻找的东西是内置在ASP.NET框架中用于处理这样的东西。我的意思是，在jQuery中，这就像$('controlID').hide一样简单。是否有可以执行此操作的Control Extender？ jQuery是ASP.NET框架的一部分吗？

Answer 1

jQuery will be/is distributed with VisualStudio/ASP.NET MVC，虽然我不会称之为框架的一部分。我认为您可以随意使用它并相信它会得到支持。

请注意，Microsoft已经表示他们将使用jQuery的主要开发线，因此代码本身与您从jQuery.com下载的内容没有任何不同，除了内置的Intellisense。

编辑：要设置您的功能，请从jquery.com下载代码。把它放在你的脚本文件夹中，或者存放javascript的东西。为您的页面添加脚本引用。使用jquery将onchange处理程序添加到下拉列表中，当下拉列表的值为other时，显示文本框，否则将其隐藏。以下示例假定other不是默认选择。如果您使用带有MasterPages的runat =“server”控件或在UserControls中，您需要调整javascript函数中的名称以考虑ASP.NET所做的名称修改。可能更简单的是给它们唯一的CSS类并使用“.class”表示法而不是“#id”表示法来引用它们。

<script type="text/javascript" src="...pathtoscript../jquery.1.2.6.js"></script>
<script type="text/javascript">
   $(document).ready( function() {
       $("#DropDownListID").bind('change', function() {
           if (this.options[this.selectedIndex].value == 'other')
           {
               $("#TextBoxID").show();
           }
           else
           {
               $("#TextBoxID").hide();
           }
       });
   });
</script>

  ...

 <select id="DropDownList">
     <option value='first'>First</option>
      ...
     <option value='other'>Other</option>
 </select>
 <input type='text' id='TextBox' style='display: none;' />

Answer 2

您还可以使用asp.net客户端框架（通过scriptmanager）来获取对元素的引用。但是你仍然需要使用正常的DOM操作。

$get('<%= myDropDown.ClientID %>').style.display = 'none';

确保引用了脚本管理器。

对于这么简单的事情，我认为不值得引用jquery，但也许你有更大的计划; - ）

最简单/最佳隐藏/显示客户端隐藏/显示ASP.NET

2 个答案: