Laravel vuejs 更改的选定索引

Posted 2023-03-14

【中文标题】Laravel vuejs 更改的选定索引

【英文标题】：Selected index on change in Laravel vuejs

【发布时间】：2021-09-17 16:13:33

【问题描述】：

当我更改选项时，如何确定 select2 上的选定索引。问题是我想确定我选择了哪个 select2，并通过调用所选选择的 id 来确定它。

我需要在更改时调用此 ID，但这取决于 select2 的索引

:id="'passenger-select-'+index"

选择2个vue

    <tr v-for="index in total" :key="index">
      <td scope="row" class="text-center">index</td>
      <td>
        <select  class="details-input form-control select2" :id="'passenger-select-'+index" :name="'pax_name_'+index">
          <option label="Label"></option>
          <option v-for="(result,index) in results" :key="index" :value="result.first_name + ' ' + result.middle_name + ' ' + result.last_name ">result.first_name result.middle_name result.last_name</option>
        </select>
      </td>
      <td><input :name="'pax_des_'+index" class="details-input form-control" type="text" disabled v-model="designation"/></td>
      <td>
        <input :name="'pax_gen_'+index" class="details-input form-control" type="text" disabled v-model="gender"/>
      </td>
   </tr>

Jquery 改变

 $('#passenger-select-').on('change', () => 
    alert("test" + index_selected);
 );

【参考方案1】：

你是说

$('[id^="passenger-select-"]').on('change', e => 
  alert("test" + e.target.selectedIndex);
); 

或

$('.select2').on('change', e => 
  alert("test" + e.target.selectedIndex);
);

【讨论】：

感谢您的回复，它在第一个选择中运行良好，但由于我在选择中一直使用 v-for，假设我有两个选择选项，第二个选择选项没有显示警报。你有什么想法吗？

对不起，我不使用 VUE。尝试inspect第二个选择，看看它是否与第一个选择器相同。但是你为什么一开始就混合使用 VUE 和 jQuery 呢？是不是 VUE 方法可以做你想做的事？