筛选按选项值选择的jquery

Question

我试图触发一个选择从另一个选择的选项。

现在，我要检查我的选项是否包含ex“ 5”的确切值，而不是像今天一样选择“ 15”和“ 25”，因为15（1-> 5 <-）和25（2-> 5 <-）也包含5。

console.log(height); // e.g 5, 10, 15, 25, 30
if($('#pa_height').children('option').filter(':contains("'+height+'")')) {

    var option = height + 'cm-' + (typeof closestPrice[1] !== 'undefined' ? closestPrice[1] : closestPrice[0]) + 'kr';
    console.log('option exists', option);

    // some of my options gives me 1 here and other 0
   console.log($('#pa_hojd').children('option[value="'+option+'"]').length); 
   .if($('#pa_height').children('option[value="'+option+'"]').length !== 0) {
        $('#pa_height').children('option[value="'+option+'"]').attr('selected', 'selected').siblings().removeAttr('selected').trigger('change');
    }
    else {
        $('#pa_height').children('option').filter(':contains("'+height+'")').last().attr('selected', 'selected').siblings().removeAttr('selected').trigger('change');
        console.log('Highest price for this height is set, Price is: ', price);
    }
} else {
    console.log('Height is not set');       
}

这些选项是woocommerce中的自定义变体，我根据您在文本区域中写入的文本量来设置产品价格。 我的一些options.length返回0，即使我可以在select中看到它们。 就像woocommerce不了解它们是选项。

有人知道有什么可以帮助我的吗？ :)

这是截图

这是我的变体选择的HTML

<select id="pa_height" class="" name="attribute_pa_hojd" data-attribute_name="attribute_pa_hojd">
    <option value="">Välj ett alternativ</option>
    <option value="5cm-79kr">5cm: 79kr</option>
    <option value="5cm-99kr">5cm: 99kr</option>
    <option value="5cm-199kr" selected="selected">5cm: 199kr</option>
    <option value="5cm-299kr">5cm: 299kr</option>
    <option value="5cm-399kr">5cm: 399kr</option>
    <option value="5cm-499kr">5cm: 499kr</option>
    <option value="10cm-149kr">10cm: 149kr</option>
    <option value="10cm-199kr">10cm: 199kr</option>
    <option value="10cm-299kr">10cm: 299kr</option>
    <option value="10cm-399kr">10cm: 399kr</option>
    <option value="10cm-499kr">10cm: 499kr</option>
    <option value="10cm-99kr">10cm: 99kr</option>
    <option value="15cm-129kr">15cm: 129kr</option>
    <option value="15cm-149kr">15cm: 149kr</option>
    <option value="15cm-249kr">15cm: 249kr</option>
    <option value="15cm-349kr">15cm: 349kr</option>
    <option value="15cm-449kr">15cm: 449kr</option>
    <option value="15cm-599kr">15cm: 599kr</option>
    <option value="20cm-150kr">20cm: 150kr</option>
    <option value="20cm-200kr">20cm: 200kr</option>
    <option value="20cm-250kr">20cm: 250kr</option>
    <option value="20cm-350kr">20cm: 350kr</option>
    <option value="25cm-450kr">25cm: 450kr</option>
    <option value="25cm-550kr">25cm: 550kr</option>
    <option value="25cm-700kr">25cm: 700kr</option>
    <option value="25cm-900kr">25cm: 900kr</option>
    <option value="30cm-1000kr">30cm: 1000kr</option>
    <option value="30cm-150kr">30cm: 150kr</option>
    <option value="30cm-200kr">30cm: 200kr</option>
    <option value="30cm-250kr">30cm: 250kr</option>
    <option value="30cm-350kr">30cm: 350kr</option>
    <option value="30cm-550kr">30cm: 550kr</option>
    <option value="30cm-750kr">30cm: 750kr</option>
    <option value="30cm-850kr">30cm: 850kr</option>
</select>

Answer 1

if($("#pa_height option[value='"+height+"']").length>0) {
//
}

Answer 2

您可以通过将搜索限制为1个字符长的字符串来排除15/25/35等。 然后，通过查找数字5，您应该获得预期的结果。 例如;

var options = document.getElementsByTagName('option');

for(var i = 0; i < options.length; i++){
  var option_value = options[i].value;
  var search_value 5;

  if(options_value.length < 1){
    // String length = 0(1). This rules out double or triple digit numbers

    if(options_value.indexOf(search_value) > -1){
      // Found the value 5

      console.log('Success!');
    }
  }
}

更新资料

既然我已经看到了您的HTML（在您进行编辑之后），那么上面的代码可能就行不通了。 您可能可以修改方法以检查“ 5”是否为第一个字符。 如果是，请检查其后是否有另一个数字。 如果不是，那么您已找到号码5。

var options = document.getElementsByTagName('option');

for(var i = 0; i < options.length; i++){
  var option_value = options[i].value();
  var first_char = option_value.charAt(0);

  if(first_char == 5){
    // first char = 5, check second
    var second_char = option_value.charAt(1);

    if(isNaN(second_char)){
      // value is not 5
    }else{
      // not a number, found 5
      // do code
    }
  }
}