Jquery выбирает на основе значения переключателя

Я просмотрел около 10 похожих вопросов, но не нашел решения своей ситуации. Я не уверен, что моя проблема в селекторе, в том, как я проверяю «если», или в том, как я пытаюсь показать/скрыть поле.

Я хочу скрыть ввод, где name="wpbpp_settings[slideshowSpeed]", если значение переключателя name="wpbpp_settings[slideshow]" равно "false"

Вот моя форма:

<div class="wrap">
    <h2>WP Blossom PuckPros Theme Options</h2>

    <form method="post" action="options.php">

        <?php settings_fields('wpbpp_settings_group'); ?>

        <h4><?php _e('Excerpt Length for Wide Page Slider', 'wpbpp_domain'); ?></h4>
        <p>
            <label class="description" for="wpbpp_settings[excerpt_length]"><?php _e('Enter the excerpt length (number of words)', 'wpbpp_domain'); ?></label>
            <input id="wpbpp_settings[excerpt_length]" name="wpbpp_settings[excerpt_length]" type="number" min="20" max="55" step="1" value="<?php echo $wpbpp_options['excerpt_length']; ?>"/>
        </p>

        <h4><?php _e('Settings for Wide Slider', 'wpbpp_domain'); ?></h4>

        <?php
           if (!isset($wpbpp_options['slideshow'])) {

           $wpbpp_options['slideshow']='false';
               }

        ?>

        <p>
            <label class="description" for="wpbpp_settings[slideshow]"><?php _e('Do you want the slider to advance automatically?', 'wpbpp_domain'); ?></label>
            <input id="wpbpp_settings[slideshow]1" name="wpbpp_settings[slideshow]" type="radio" <?php if($wpbpp_options['slideshow'] == 'true') echo 'checked="checked"'; ?> value="true" />Yes
            <input id="wpbpp_settings[slideshow]2" name="wpbpp_settings[slideshow]" type="radio" <?php if($wpbpp_options['slideshow'] == 'false') echo 'checked="checked"'; ?> value="false" />No

         </p>
         <p>   
            <label class="description" for="wpbpp_settings[slideshowSpeed]"><?php _e('How often do you want the slider to advance (number of seconds)?', 'wpbpp_domain'); ?></label>
            <input id="wpbpp_settings[slideshowSpeed]" name="wpbpp_settings[slideshowSpeed]" type="number" min="1" max="8" step="1" value="<?php echo $wpbpp_options['slideshowSpeed']; ?>"/>
        </p>

        <p class="submit">
            <input type="submit" class="button-primary" value="<?php _e('Save Options', 'wpbpp_domain'); ?>" />
        </p>

    </form>

</div>

и мой jquery:

<script  type="text/javascript">

jQuery(document).ready(function($) {

  togglefields();

  $('input:radio[name="wpbpp_settings[slideshow]"]').val().change(function() { togglefields(); });
});   


  function togglefields() { 
   if ($('input:radio[name="wpbpp_settings[slideshow]"].prop("checked", true)').val() =="true") {
      $('input:radio[name="wpbpp_settings[slideshowSpeed]"]').show();
    } else {
       $('input:radio[name="wpbpp_settings[slideshowSpeed]"]').hide();
    }   

</script>

_______ ИЗМЕНИТЬ ____ __________

Итак, теперь я подошёл поближе. Моя проблема в том, что мое утверждение «если» всегда оценивается как «истина».

Вот пересмотренный jquery:

<script  type="text/javascript">

jQuery(document).ready(function($) {

  togglefields();

  $('input[name="wpbpp_settings[slideshow]"]').change(function(){ togglefields() });

});   

  function togglefields() { 
   if (jQuery('input[name="wpbpp_settings[slideshow]"]').val() =="true") {
      jQuery('input[name="wpbpp_settings[slideshowSpeed]"]').show();
      alert ('show');
    } else {
       jQuery('input[name="wpbpp_settings[slideshowSpeed]"]').hide();
       alert ('hide');

    }   
   }
</script>

person tangobango    schedule 26.03.2014    source источник
comment
Вам не хватает закрывающей скобки.   -  person pmandell    schedule 26.03.2014
comment
.val().change( говоришь? .val() не содержит метод change - он должен быть указан в консоли... проверьте консоль!   -  person tymeJV    schedule 26.03.2014
comment
@pmandell Я отразил эти изменения и немного больше, но у меня все еще есть проблемы с оператором if. См. пересмотренное определение проблемы.   -  person tangobango    schedule 26.03.2014


Ответы (2)


Попробуйте войти jQuery('input[name="wpbpp_settings[slideshow]"]').val() в консоль. и посмотрите, правильно ли вы проводите сравнение. Ваш подход должен быть:

  1. Выберите группу переключателей с помощью name="wpbpp_settings[slideshow]"
  2. Найдите отмеченную кнопку для этой группы
  3. Найдите его значение
  4. Сравните и делайте, что хотите

    var selectedButton=$("input[name='wpbpp_settings[slideshow]']"]:checked"); var value = selectedButton.val();

или даже как,

var selectedValue = $("input[name='wpbpp_settings[slideshow]']"]:checked").val();

Посмотрите, что вы получите в selectedValue, а затем проведите дальнейшее сравнение.

person bpositive    schedule 26.03.2014
comment
Мне потребовалось некоторое время, чтобы увидеть, как встроить ваше предложение, но я, наконец, исправил его. Спасибо. - person tangobango; 29.03.2014

Вы ищете проверенное свойство переключателя. .val() не приносит вам этого.

Вместо этого проверьте свойство

// This would give you info whether the radio is checked or not
  if (jQuery('input[name="wpbpp_settings[slideshow]"]').is(':checked')) {
person Sushanth --    schedule 26.03.2014