Проверьте, выбрана ли опция

Question

Я делаю файл для своей компании на их CMS, используя HTML, CSS, PHP и jQuery, я создал select с несколькими option элементами в качестве причины возврата. Некоторый контент скрыт, и show() запускается только при выборе определенной опции.

jQuery code:

// if option defective product is selected, vehicle information gets showed

$("select#ReasonReturn").change(function() {
  var data = $("select#ReasonReturn option:selected").val();
  if ($(this).val() === 'Defectiveproduct') {
    $("td[data-block=vehicle-information]").show();
    $("td[remark-block=remark-header]").text('Toelichting');
  }

});


// if option other is selected remark changes to other, namely / remark

$("select#ReasonReturn").change(function() {
  if ($(this).val() === 'Other') {
    $("td[remark-block=remark-header]").text('Anders, namelijk / Toelichting');
    $("td[data-block=vehicle-information]").hide();
  }

});

//if any other option is selected set to default

$("select#ReasonReturn").change(function() {
  if ($(this).val() != 'Other' && $(this).val() != 'Defectiveproduct') {
    $("td[remark-block=remark-header]").text('Toelichting');
    $("td[data-block=vehicle-information]").hide();
  }
}); 

Как вы видите, я сейчас использую событие change()обнаружить изменение. Единственная проблема заключается в том, что при перезагрузке страницы опция «Дефектный продукт» все еще выбрана. Ничего не происходит, потому что событие будет срабатывать только при изменении, а не при выборе.

Мой вопрос:

Существует ли простой способ проверить выбранное значение непосредственно после загрузки страницы, а не только наменять? Я надеюсь, что мой вопрос ясен, спасибо за помощь!

PS: Я могу показать больше кода, если необходимо.

Answer 1

вы можете проверить выбранное значение при загрузке страницы. Пожалуйста, попробуйте следующий код

$(document).ready(function(){
$("select#ReasonReturn option:selected").val();
});

Answer 2

Во-первых, вам не нужно регистрировать несколько обработчиков change, вы можете сделать это только с одним обработчиком события изменения, используя оператор if () {} else if(){}.

Во-вторых, поместите весь свой код в DOMфункция ready и вызывает событие change для выполнения своей работы, когда DOM готов.

  $(function(){

    $("select#ReasonReturn").change(function() {
      var data = $("select#ReasonReturn option:selected").val();

      if ($(this).val() === 'Defectiveproduct'){
        $("td[data-block=vehicle-information]").show();
        $("td[remark-block=remark-header]").text('Toelichting');
      }else if($(this).val() === 'Other') { 
        // if option other is selected remark changes to other, namely / remark
        $("td[remark-block=remark-header]").text('Anders, namelijk / Toelichting');
        $("td[data-block=vehicle-information]").hide();
      }else if ($(this).val() != 'Other' && $(this).val() != 'Defectiveproduct') {

        //if any other option is selected set to default
        $("td[remark-block=remark-header]").text('Toelichting');
        $("td[data-block=vehicle-information]").hide();
      }
    }).change();

  });

Answer 3

это должно сделать работу за вас при перезагрузке страницы

$(document).ready(function(){
 $("select#ReasonReturn").trigger('change');
 })