Проблемы с подбором jquery

Question

В моем коде у меня есть этот цикл, который вызывает различные 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 (). Sibling, .sibling ... и т.д.

/*----SELECT TIME----*/ 
$(".clientSearchSectionButtonTextTime").live("click", function() {
    startTime = $(this).parent().next(".clientSearchSectionButtonHiddenTextStartTime").text();
    endTime = $(this).parent().next(".clientSearchSectionButtonHiddenTextEndTime").text();
    alert (endTime);
});

Answer 1

Конечно, .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 (а не только путем выбора следующего элемента).

Answer 2

если вам не нужно видеть, вы можете использовать скрытый ввод, как этот

<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);

});

Я не пробовал, но все должно быть в порядке

Answer 3

Если решения 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();
});

Answer 4

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.

Answer 5

Попробуйте использовать .find () вместо .next ()

Например:

endTime = $(this).parent().find(".clientSearchSectionButtonHiddenTextEndTime").text();