Onchange从字符串中删除值

Question

我只想一次将选定值（不是o1-o2）作为字符串添加到变量中，进行onchange，删除旧值，然后将新选定值添加到字符串中。

$("#hotelVel").on("change", function() {
  let size = $("#hotelVel :selected").val();
  kod = kod + size;
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select style="float:right;" name="first" id="hotelVel">
  <option value="-o1" name="velikost">Single room (10m²)</option>
  <option value="-o2" name="velikost">Double room (15m²)</option>
</select>

Answer 1

您可以在连接前清空变量。

let kod = 'z5';
$("#hotelVel").on("change", function() {
  let size = '';
  //kod = kod + size;
  size = $("#hotelVel :selected").val()
  kod = kod.split('-')[0] + size;
  console.log(kod);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select style="float:right;" name="first" id="hotelVel">
  <option value="-o1" name="velikost">Single room (10m²)</option>
  <option value="-o2" name="velikost">Double room (15m²)</option>
  <option value="-o3" name="velikost">Double room (20m²)</option>
  <option value="-o4" name="velikost">Double room (25m²)</option>
</select>

Answer 2

在函数调用时使kod为空。使用子字符串删除每次调用的多余值

var kod='string'
$("#hotelVel").on("change", function() {
let size = $("#hotelVel :selected").val()
var aux=kod;
kod =aux+size;
console.log(kod)

kod=aux;
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select style="float:right;" name="first" id="hotelVel">
     <option value="-o1" name="velikost">Single room (10m²)</option>
     <option value="-o2" name="velikost">Double room (15m²)</option>
</select>

Answer 3

首先，您可以将$（“＃hotelVel：selected”）。val（）简化为$（“＃hotelVel”）。val（）。 我假设kod包含房间的所有选项，对吗？在这种情况下，我只想看看字符串中是否已经有另一个选项：

$("#hotelVel").on("change", function() {
let size = $("#hotelVel").val();
let roomOptionsArr = kod.split("-");
let options = $(this).find("option").val();
let check = "";
for(let i = 0; i < roomOptionsArr.length; i++){
    if(options.includes("-" + roomOptionsArr[i])){
        check = "-" + roomOptionsArr[i];
        break;
    }
}
kod = kod.replace(check, "");
kod += size; // I simplified kod = kod + size by using += that appends automatically
});

Answer 4

希望这会对您有所帮助。

$('#hotelVel').change(function(){
  let kod ='This is My String :';
  kod = kod+$(this).val();
  console.log(kod);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select style="float:right;" name="first" id="hotelVel">
     <option value="-o1" name="velikost">Single room (10m²)</option>
     <option value="-o2" name="velikost">Double room (15m²)</option>
</select>

Answer 5

您可以使用临时变量存储所选值，并在更新kod时进行比较，如下所示。

let kod = 'My string';
let hotelValue = '';

$("#hotelVel").on("change", function() {
  if (hotelValue != '' && kod.includes(hotelValue)) {
    kod = kod.replace(hotelValue, '');
  }
  hotelValue = $("#hotelVel :selected").val();
  kod = kod + hotelValue;
  console.log(kod);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select style="float:right;" name="first" id="hotelVel">
  <option value="-o1" name="velikost">Single room (10m²)</option>
  <option value="-o2" name="velikost">Double room (15m²)</option>
</select>

Answer 6

仅定位<select>

从<select>提取值时，您只需要应用JavaScript属性.value：

 let size = document.querySelector('#hotelVel').value

将

或 jQuery方法.val()直接应用于<select>，则无需弄乱<option> s：

  let size = $(this).val();

---

演示

$("#hotelVel").on("change", function() {
  let size = $(this).val();
  let kod = 'z5' + size;
  console.log(kod);
});

<select style="float:right;" name="first" id="hotelVel">
  <option value="-o1" name="velikost">Single room (10m²)</option>
  <option value="-o2" name="velikost">Double room (15m²)</option>
</select>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>