在我的代码中,我有一个循环,它会产生各种2小时的时间块。我发现很难从.clientSearchSectionButtonHiddenTextEndTime中获取文本。我从.clientSearchSectionButtonHiddenTextStartTime中取出文本没有问题。
PHP
while($row = mysql_fetch_array($result)) {
$startTimeVar = $row["startTime"];
$startTimeCorrected = date("g:i a", strtotime($startTimeVar));
$endTimeVar = $row["endTime"];
$endTimeCorrected = date("g:i a", strtotime($endTimeVar));
echo
'<div class = "clientSearchSectionButtonText">
<div class = "clientSearchSectionButtonTextTime">
'.$startTimeCorrected.' - '.$endTimeCorrected.'
</div>
</div>
<span class = "clientSearchSectionButtonHiddenTextStartTime" style = "display: none;">
'.$row["startTime"].'
</span>
<span class = "clientSearchSectionButtonHiddenTextEndTime" style = "display: none;">
'.$row["endTime"].'
</span>
<div class = "buttonBreak">
</div>';
}
JQuery-我尝试过用多种方式选择它$这将提供div clientSearchSectionButtonTextTime。我尝试了很多不同的东西,包括parent().next、parent(.兄弟姐妹、.兄弟姐妹…等等
/*----SELECT TIME----*/
$(".clientSearchSectionButtonTextTime").live("click", function() {
startTime = $(this).parent().next(".clientSearchSectionButtonHiddenTextStartTime").text();
endTime = $(this).parent().next(".clientSearchSectionButtonHiddenTextEndTime").text();
alert (endTime);
});
果不其然,.next()
只选择下一个同级。若给定了一个选择器,那个么将测试单个同级以匹配它,否则结果为空。
试试.nextAll('.uncannyClassName')
,你应该可以去了。
/*----SELECT TIME----*/
$(".clientSearchSectionButtonTextTime").live("click", function() {
startTime = $(this).parent().nextAll(".clientSearchSectionButtonHiddenTextStartTime").text();
endTime = $(this).parent().nextAll(".clientSearchSectionButtonHiddenTextEndTime").text();
alert (endTime);
});
我还将它添加到.clientSearchSectionButtonHiddenTextStartTime
中,以允许DOM的未来可伸缩性(而不仅仅是通过选择下一个元素)。
如果不需要查看,可以使用像这样隐藏的输入
<input type="hidden" name="clientSearchSectionButtonHiddenTextStartTime[]" value="<?php echo $row['startTime']; ?>" />
<input type="hidden" name="clientSearchSectionButtonHiddenTextEndTime[]" value="<?php echo $row['endTime']; ?>" />
但回到你的麻烦,你可以在你的html中做这样的事情,只为chiarify
while($row = mysql_fetch_array($result)) {
$startTimeVar = $row["startTime"];
$startTimeCorrected = date("g:i a", strtotime($startTimeVar));
$endTimeVar = $row["endTime"];
$endTimeCorrected = date("g:i a", strtotime($endTimeVar));
echo '<div class="group">
<div class="clientSearchSectionButtonText">
<div class="clientSearchSectionButtonTextTime">'.$startTimeCorrected.' - '.$endTimeCorrected.'</div>
</div>
<span class="clientSearchSectionButtonHiddenTextStartTime" style="display: none;">'.$row["startTime"].'</span>
<span class="clientSearchSectionButtonHiddenTextEndTime" style="display: none;">'.$row["endTime"].'</span>
<div class="buttonBreak"></div>
</div>';
}
对每条记录进行分组,这样您就可以简单地使用像这样的jquery
/*----SELECT TIME----*/
$(".clientSearchSectionButtonTextTime").live("click", function() {
startTime = $(this).parent('groups').find(".clientSearchSectionButtonHiddenTextStartTime").text();
endTime = $(this).parent('groups').find(".clientSearchSectionButtonHiddenTextEndTime").text();
alert (endTime);
});
我没有尝试,但应该可以
尝试使用.find()而不是.next()
例如:
endTime = $(this).parent().find(".clientSearchSectionButtonHiddenTextEndTime").text();
echo '
<div name="'.$count.'" class = "clientSearchSectionButtonText">
<div class = "clientSearchSectionButtonTextTime">
'.$startTimeCorrected.' - '.$endTimeCorrected.'
</div>
</div>
<span name="'.$count.'" class = "clientSearchSectionButtonHiddenTextStartTime" style = "display: none;">
'.$row["startTime"].'
</span>
<span name="'.$count.'" class = "clientSearchSectionButtonHiddenTextEndTime" style = "display: none;">
'.$row["endTime"].'
</span>
<div class = "buttonBreak">
</div>';
$(".clientSearchSectionButtonTextTime").live("click", function() {
name = $(this).getAttribute("name");
startTime = $('.clientSearchSectionButtonHiddenTextStartTime[name="'+name+'"]');
});
我已经有一段时间没有编写自己的CSS选择器了,但你应该能够理解这个想法
在每个div/span上放置一个公共标识符,比在DOM中导航更容易。
如果next()
和closest()
解决方案不起作用,则需要调试代码。从执行这个开始,看看它是否有效:
/*----SELECT TIME----*/
$(".clientSearchSectionButtonTextTime").live("click", function() {
alert ($(this).parent().next(".clientSearchSectionButtonHiddenTextStartTime").text());
//startTime = $(this).parent().next(".clientSearchSectionButtonHiddenTextStartTime").text();
//endTime = $(this).parent().next(".clientSearchSectionButtonHiddenTextEndTime").text();
});