简单的 jQuery 在 HTML 中工作,而不是在 ASP.NET 中工作

发布于 2024-08-06 09:35:21 字数 964 浏览 3 评论 0原文

jQuery菜鸟在这里,试图产生交替的行背景颜色。这在 HTML 中有效:

<script type="text/javascript">
            $(document).ready(function() {
                   $('.stripedtable tr:even td').addClass(" evenrow");
                    alert("Just executed stripedtable jQuery in MasterPage");
            });
</script>

“evenrow”类被添加到 的类中,仅适用于偶数行。伟大的!

除非我将其放入 ASP.NET MasterPage 中,否则永远不会添加“evenrow”类。在 FireBug 中,我确认该函数正在执行并且 jQuery 在那里。 alert() 指示该方法在页面加载后触发。不过,没有“evenrow”类别,也没有条纹。

可能相关的是,未按我的意愿更改的表是由继承自 MasterPage 的页面上的 UserControl 生成的。

这很奇怪。当我转到查看源代码,将整个源代码复制到 NoStripes.html,并在浏览器中打开 HTML 页面时,我得到了“evenrow”类和条纹。 jQuery 工作得很好。

这似乎意味着(不知何故)当该方法从 MasterPage 触发时,HTML 并不真正存在?那么jQuery不能修改它吗?! HTML 就在那里,带有 NoStripes.html,因为我保存了生成的源代码?!

我尝试将 $('.stripedtable 等) 放在 UserControl 上的内容占位符上。 alert() 显示它正在触发。没有条纹。

建议?我用谷歌搜索了很长一段时间,但没有找到解决方案。这可能很简单,但我无法弄清楚。

TIA-霍伊斯特

jQuery noob here, trying to produce alternating row background colors. This works in HTML:

<script type="text/javascript">
            $(document).ready(function() {
                   $('.stripedtable tr:even td').addClass(" evenrow");
                    alert("Just executed stripedtable jQuery in MasterPage");
            });
</script>

The "evenrow" class is added to the 's class, for even rows only. Great!

Except when I put it into an ASP.NET MasterPage, the "evenrow" class is never added. In FireBug, I confirm that the function is being executed and jQuery is there. The alert() indicates that the method is firing after the page is loaded. No "evenrow" class, though, and not stripes.

It's probably relevant that the table that is NOT being altered as I'd like, is generated by a UserControl on a page that inherits from the MasterPage.

This is weird. When I go to View Source, copy the entire source to NoStripes.html, and open the HTML page in a browser, I get the "evenrow" class and the stripes. jQuery works fine.

This seems to imply that (somehow) the HTML is not really there, when the method fires from the MasterPage? So jQuery can't modify it?! And the HTML IS there, with NoStripes.html, because I saved the generated source?!

I tried putting the $('.stripedtable etc) on a content placeholder on the UserControl. The alert() shows it firing. No stripes.

Suggestions? I've googled at length without finding a solution. It's probably something simple, but I can't figure it out.

TIA - Hoytster

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(7

谜泪 2024-08-13 09:35:21

尝试添加 css 样式而不是类,例如 .css("font-weight", "bold");看看您是否有样式表问题

Try adding a css style instead of the class, such as .css("font-weight", "bold"); to see if you instead have a stylesheet problem

荒路情人 2024-08-13 09:35:21

我敢打赌 .NET 对表做了一些处理,使 .stripedtable tr:even td 选择器变得无用。你说你一直在使用 firebug,我建议摆弄选择器(尝试在控制台中 $(".stripedtable tr:even td") 并查看它选择的内容),如果没有给你你想要的元素,尝试不使用 .stripedtable 部分。

I'd bet .NET does something with the table that renders the .stripedtable tr:even td selector useless. you said you've been using firebug, I recommend fiddling with the selector (try $(".stripedtable tr:even td") in the console and see what it selects), if it doesn't give you the elements you want, try without the .stripedtable part.

你的往事 2024-08-13 09:35:21

如有疑问,请设置调试器断点并单步执行代码。基本建议,但它应该可以帮助您找到问题。把“调试器;”进入文档就绪代码,然后将选择器分解为单独的 var 分配,这样您就可以看到 a) 代码是否完全触发以及 b) 是否正在选择某些内容(长度应大于 0)。如果您没有得到任何选择,请尝试交互式 FireBug 控制台(或 IE 中的监视表达式)来键入选择器,直到找到正确的选择器。

您可能还想检查您的 CssClass .stripedtable 是否如您所期望的那样存在于渲染的 HTML 文档输出中。

When in doubt set a debugger breakpoint and step through the code. Basic advice but it should help you find the issue. Put 'debugger;' into the document ready code and then break out the selector as a separate var assignment so you can see a) if the code fires at all and b) whether it's selecting something (length should be > 0). If you don't get any selections try the interactive FireBug console (or watch expression in IE) to type a selector until you find the right one.

You might also want to check if your CssClass .stripedtable exists as you expect in the rendered HTML document output.

起风了 2024-08-13 09:35:21

当我读到你的标题时,我首先想到的是 ASP.NET 在用户控件内部时如何动态命名其字段。我认为您可能引用了像“#mytable”这样的 id,然后它被重命名为“#mycontrol_mytable”。但我发现您正在引用一个类名,所以这不可能是它。

另一件可能影响您的事情是文档类型。文档类型有时会影响一些古怪的东西(尤其是在 IE 中)。您是否已验证 ASPX 文件中使用的文档类型与 HTML 文件相同?

您可以尝试使用类似于 StackOverflow 中的文档类型:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

The first thing I thought of when I read your title is how ASP.NET dynamically names its fields when they're inside user controls. And I thought you might be referencing an id like "#mytable" which has then be renamed "#mycontrol_mytable." But I see that you're referencing a class name so that can't be it.

The other thing that comes to mind which may be affecting you is the doctype. The doctype tends to affect some wacky things sometimes (especially in IE). Have you verified that the doctype you're using in the ASPX file is the same as the HTML file?

You might try a doctype like the one in StackOverflow:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
留一抹残留的笑 2024-08-13 09:35:21

确保首先验证最终结果的 HTML。它比以前好得多,但在过去,.net 控件因发出无效标记而臭名昭著,这些标记可能会扰乱 DOM 的遍历。

Make sure you validate the end-result's HTML first. It's much better than it used to be, but in the past, .net controls were notorious for spitting out invalid markup that can mess with traversing the DOM.

茶花眉 2024-08-13 09:35:21

jQuery 脚本实际上可能在您的表加载到页面之前运行。您可以尝试将脚本添加到母版页的底部,甚至使用母版页代码后面的注册脚本方法来确保它是最后加载的内容。

您还可以发布您也尝试附加 jquery 脚本的表的标记。可能有一些不靠谱的东西导致了小费没有被应用。

编辑
我去玩了你的 jquery 并拼凑了一个快速母版页、子页面示例,这就是我想出的。在母版页的头部使用以下脚本:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('.stripedtable tr:even').addClass("evenrow");
    alert("Just executed stripedtable jQuery in MasterPage");
});

然后在样式表中我放置了这个定义:

tr.evenrow td {background: Red;} 

然后我创建了一个控件,然后将其放入一个简单的表格中,如下所示,并将类名放在表格元素上:

<table class="stripedtable"><tr><td></td></tr></table>

当我运行页面时,一切都对我有用。我认为问题在于,在您拥有的 jquery 代码中,您的级别比您需要的低一级。您只需要表格,然后是行,然后是 :even 标记。您的示例代码被扔在 td 元素中,我认为您并不真正需要。

希望这对你有用。

The jQuery script might actually be running before your table has been loaded on to the page. You might try to add your scripts at the bottom of the master page or even use a register scripts method from the master page code behind to make sure that it's the last thing to load.

You might to also post your markup for the table that you're trying to attach your jquery script too. There could be something wonkie with it that is causing the stipping from not being applied.

EDITED
I went and played with your jquery and threw together a quick master page, child page example and this is what I came up with. Use the following script in the head of the master page:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('.stripedtable tr:even').addClass("evenrow");
    alert("Just executed stripedtable jQuery in MasterPage");
});

Then in the stylesheet I placed this definition:

tr.evenrow td {background: Red;} 

I then created a control and just tossed in a simple table like this with your class name on the table element:

<table class="stripedtable"><tr><td></td></tr></table>

When I ran the page everything worked for me. I think what the issue is is that in the jquery code that you have you're going one level lower than what you need. You just need the table, then the row and then the :even marker. Your example code as tossed in the td element which I dont' think you really need.

Hope this works for you.

昇り龍 2024-08-13 09:35:21

非常感谢大家。对于菜鸟来说,所有答案都是有用的。添加 .css() 很聪明。我应用了提供的 javascript 来作用于 而不是 。突破在于 FireBug 控制台的建议,我从未使用过它。我一直在寻找一种查看选择器结果的方法,这让一切变得不同。火虫太棒了

这就是我们学习的方式;太糟糕了,太痛苦了。

问题在于区分大小写。在我的 ASP.NET 标记中,我的 CssClass 是“StripedTable”,而我的 jQuery 表达式正在寻找“stripedtable”。我知道 javascript 不区分大小写——但是 STRINGS 是区分大小写的,你这个鸟脑子!啊。

顺便说一句,我需要转到 级别,因为我的前辈在该级别应用样式,并且它们通常包含背景颜色 - 所以我必须修改 类赢得特异性之战。

因此 $('.stripedtable tr:even td').addClass(" Evenrow"); 将 的类从“CellStyleLeft”更改为“CellStyleLeft Evenrow”——偶数行出现在最后,所以它赢了!

终于有用了。谢谢大家!

——霍伊斯特

Thank you all SO much. For a noob, all the answers were useful. Adding the .css() was clever. I applied the supplied javascript to act on <tr>s instead of <td>s. The breakthrough was the suggestion of the FireBug console, which I've never used. I've been SEARCHING for a way to see the results of a selector, and that made all the difference. FireBug is awesome.

This is how we learn; too bad it is so painful.

THE PROBLEM WAS CASE-SENSITIVITY. In my ASP.NET markup, my CssClass was "StripedTable", and my jQuery expression was looking for "stripedtable." I knew that javascript is not case-sensitive -- but STRINGS are, you bird-brain! Argh.

I need to go to the <td> level, by the way, because my predecessors applies styles at the level, and they often include background-color -- so I had to modify the <td> class to win the specificity battle.

So $('.stripedtable tr:even td').addClass(" evenrow"); changes the 's class from "CellStyleLeft" to "CellStyleLeft evenrow" -- and the evenrow comes last, so it wins!

It works, finally. THANKS, everyone!

-- Hoytster

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文