jQuery手风琴隐藏在动态页面中的表中 [英] JQuery Accordion Buried in a Table within Dynamic Page
问题描述
我正在尝试访问隐藏在Divs和其他东西下的手风琴的Moveover属性.这是HTML:
I'm trying to access the Moveover property of an Accordion buried under Divs and other stuff. Here is the HTML:
<body>
<form id="form1" runat="server" >
<div id="content" class="content">
<table style="width: 1200px">
<tr>
<td style="width: 800px">
<h1>Title here</h1><br />
stuff here.. blah blah..
<div id="wrapping" class="wrapping">
<p class="accordionButton"><strong>Water-Related Services</strong></p>
<div class="accordionContent">
Item 1<br />
Item 2<br/>
Item 3<br />
</div>
<p class="accordionButton"><strong>Fire and Smoke Problem</strong></p>
<div class="accordionContent">
Item 1<br />
Item 2<br />
Item 3<br />
</div>
<p class="accordionButton"><strong>Mold Problems</strong></p>
<div class="accordionContent">
Mold Remediation<br />
</div>
</div>
</td>
<td style="width:auto; text-align:center">
<p style="text-align:center; font-size:xx-large; color:Red">CALL TODAY</p><br />
</td>
</tr>
</table>
</div>
这是我用来尝试访问手风琴按钮的脚本的一部分:
Here is the portion of the script I'm using to TRY to access the Accordion buttons:
$('.wrapping').find('p.accordionButton').mouseover(function() {
$('div.accordionContent').slideUp('normal');
$(this).next().slideDown('normal');
});
我在Mouseover函数中放置了一个ALERT命令,它从不触发,所以我知道我没有正确到达手风琴"按钮.有人可以帮忙吗?
I've placed an ALERT command inside the Mouseover function and it never fires, so I know I'm not reaching the Accordion button properly. Can anyone help?
已添加:这是整个JQuery脚本.它不大,但是很多余.我将此ASP.NET页作为动态网页.我知道我有多余的人,但我是JQuery的新手:
Added: Here is the entire JQuery script. It's not big, but it's redundant. I have this ASP.NET page as a dynamic web page. I know I have redundancies, but I'm new at JQuery:
//检查URL中的哈希值
var hash = window.location.hash.substr(1);
// Check for hash value in URL
var hash = window.location.hash.substr(1);
var href = $('#nav li a').each(function(){
var href = $(this).attr('href');
if(hash==href.substr(0,href.length-4)){
var toLoad = hash + '.htm #content';
$('#content').load(toLoad)
}
});
$(document).ready(function(){
$(document).ready(function() {
//ACCORDION BUTTON ACTION
$('.wrapping').find('p.accordionButton').mouseover(function() {
$('div.accordionContent').slideUp('normal');
$(this).next().slideDown('normal');
});
//HIDE THE DIVS ON PAGE LOAD
$(".accordionContent").hide();
if (hash=="") {
$('#content').load("welcome.aspx #content", showNewContent());
}
$('#nav li a').click(function(){
var toLoad = $(this).attr('href')+' #content';
$('#content').hide('fast',loadContent);
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('normal');
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show(hideLoader());
}
function hideLoader() {
$('#load').fadeOut('normal');
}
return false;
});
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show(hideLoader());
}
function hideLoader() {
$('#load').fadeOut('normal');
}
});
推荐答案
我通过删除启用动态页面的代码解决了此问题.这简化了代码并消除了一定程度的复杂性.
I solved this issue by removing the code that enabled dynamic pages. That simplified the code and removed a level of complexity.
上面显示的代码有效,我什至使它更加出色.如果您对此感到好奇,请访问我的测试网站.
The code shown above works, and I even made it fancier. If you are curious about it, check out my test site.
这篇关于jQuery手风琴隐藏在动态页面中的表中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!