asp.net + css + jQuery - 它们如何协同工作？

Question

我想了解如何使用jQuery来使用asp.net和css.当我正在编写asp.net代码时,例如我正在添加一个页面DropDownList,当我在Web浏览器中打开页面源时,我无法在源代码中看到它.而不是下拉列表,我可以看到选择标记.什么时候做"魔术"来改变asp.net标签来选择？更有甚者,我看不到我的CSS类名添加到asp.net标签.有一些不同的CSS类名.但是当我在IE中打开开发人员工具时,我可以看到CSS类名,这与我的定义相同.最后一件事.我可以在jQuery中使用哪些标签来遍历在asp.net中开发的页面.我在浏览器中使用我在浏览器页面的源代码中看到的标签,或者我可以询问关于asp的jQuery.净标签？CSS类怎么样？为什么我在浏览器的页面源中看不到它们？可以在jQuery查询下使用我的CCS类名吗？请问,任何人都可以解释一下这三种技术如何协同工作？

Answer 1

什么时候做"魔术"来改变asp.net标签来选择？

您想知道的大多数"魔法"都是由ASP.NET控件完成的,这些控件旨在生成发送到浏览器的标记.

当收到请求时,应用程序遍历每个控件,调用其Render方法(继承自Control类),这允许每个控件生成它们所代表的标记.

按照您的示例,DropDownList控件生成<select>标记.作为a ListControl,它使用ListItem控件在其中创建<option>标记.

另一个是GridView,它生成一个<table>使用GridViewRow控件<tr>和各种HTML控件,例如TableCellfor <td>和<th>,以创建标记的其余部分.

我用浏览器中的页面源代码中看到的标签,或者我可以问一下关于asp.net标签的jQuery吗？

不,jQuery/JavaScript不知道服务器端控件名称,只知道它们生成的标记.所以,不是搜索,而是$('DropDownList')搜索$('select').

更有甚者,我看不到我的CSS类名添加到asp.net标签.有一些不同的CSS类名.

通过" CSS名称 ",你的意思是ID吗？我很遗憾地问,但是CssClass属性不应该从服务器端改变到客户端,只是名义上的CssClass改变class.

另一方面,ID作为前缀以确保它们在整个页面中的唯一性,包括MasterPage和ContentPlaceHolder名称的前缀(如果使用它们).出于这个原因,我将避免尝试使用ID将CSS应用于服务器端控件,而是使用类.

现在,ID的结尾应该保留为您在服务器端提供的ID,因此您仍然可以使用带有选择器[name$='value']的属性末尾在jQuery中找到该元素:

# ASP
<asp:DropDownList ID="AnyGivenDropDown" runat="server" />

# HTML (generated)
<select id="ctl00_PageContents_AnyGivenDropDown"></select>

# JavaScript
$('select[id$="_AnyGivenDropDown"]');

否则,我会坚持使用类来查找您正在寻找的控件:

# ASP
<asp:DropDownList ID="AnyGivenDropDown" CssClass="anygiven" runat="server" />

# HTML (generated)
<select id="ctl00_PageContents_AnyGivenDropDown" class="anygiven"></select>

# JavaScript
$('select.anygiven');

# CSS
.anygiven { }