根据 URL 中的关键字隐藏带有 Javascript 的下拉选项

Question

我需要根据它们的来源 URL 隐藏产品的某些选项。然而，这对我来说有点棘手，因为在这种情况下我无法定位选项值。

示例 URL：http://www.website.com/department/alabama/shirt.html

<select id="select_135">
    <option value="">-- Please Select --</option>
    <option value="1849" selected="selected">NONE </option>
    <option value="1850">Alabama 1</option>
    <option value="1851">Alabama 2</option>
    <option value="1852">Arizona</option>
    <option value="1853">California</option>
    <option value="1854">Texas</option>
</select>

在这种情况下，我想隐藏所有没有“阿拉巴马”一词的选项，而不使用值编号。目标是让它在整个站点范围内工作，所以如果他们在另一个类别中，它会做同样的事情，但使用新的 URL.

所以对于下一个州：http://www.website.com/department/texas/shirt3434.html，它会做同样的事情，但对 Texas 这个词。

关于如何做到这一点有什么想法吗？

Answer 1

使用 indexOf 检查子字符串的出现。

var url = "http://www.website.com/department/alabama/shirt.html";
var s = $('#select_135 option');
var pieces = url.split("/");
var state = pieces[pieces.length-2];
for(var i = 0; i < s.length; i++) {
if(s[i].text.toLowerCase().indexOf(state) > -1) $(s[i]).show();
else $(s[i]).hide();
}

Answer 2

使用下面的代码。检查 DEMO

$( document ).ready(function(){
 var url = " http://www.website.com/department/alabama/shirt.html";

  // to get URL use below code
  // var url = window.location.href;

 url =  url.split('/');
 var word = url[url.length-2];

 $("#select_135 option").each(function(){
   if($(this).text().toLowerCase().indexOf(word) == -1){
     $(this).hide();   
   }
 });
});

根据 URL 中的关键字隐藏带有 Javascript 的下拉选项

Hide dropdown options with Javascript based on keyword in the URL

javascript

jquery

magento