Javascript preventDefault（）不处理特定选项选择

我有一个

列表，根据单击的选项选择不同的选项并重新路由。html代码是：

      <select id="pageSelect" name="Choose Page" onchange="location = this.value">
        <option value='' disabled selected hidden>Choose Page</option>
        <option value='/page-1'>Page 1</option>
        <option value='/page-2'>Page 2</option>
        <option value="allPages" >Custom Page</option>
      </select>

该函数起作用，当用户单击最后一个选项时，它会触发弹出的模式，但它仍然会根据

value=“allPages”

将用户重定向到另一个页面，即使我正在使用

preventDefault（）

函数。

preventDefault（）call仅停止当前的

change

事件处理程序。通过

onchange

属性指定的一个将仍然运行，因为它是完全独立的

要解决此问题并改进代码，请删除

onchange

属性（因为它们已经过时，现在被认为是不好的做法），并将它们合并到一个不引人注目的事件处理程序中

$（'#pageSelect'）。更改（函数（事件）{
event.preventDefault（）
var pagesvalueselect=$（this.val（）；
如果（页面值选择==“所有页面”）{
log（'打开模式…'）；
//$（'siteSaleModal'）.modal（“show”）；//打开模式
}否则{
log（'重定向到'+pagesvalueselect+'…'）；
//window.location.assign（页面值选择）；
}
});

选择页面
第1页
第2页
自定义页
调用
preventDefault（）
只会停止当前的
更改
事件处理程序。通过
onchange
属性指定的一个将仍然运行，因为它是完全独立的

要解决此问题并改进代码，请删除
onchange
属性（因为它们已经过时，现在被认为是不好的做法），并将它们合并到一个不引人注目的事件处理程序中


$（'#pageSelect'）。更改（函数（事件）{
event.preventDefault（）
var pagesvalueselect=$（this.val（）；
如果（页面值选择==“所有页面”）{
log（'打开模式…'）；
//$（'siteSaleModal'）.modal（“show”）；//打开模式
}否则{
log（'重定向到'+pagesvalueselect+'…'）；
//window.location.assign（页面值选择）；
}
});

选择页面
第1页
第2页
自定义页
您的代码在没有
event.preventDefault（）和
onchange
属性的情况下运行良好

<select id="pageSelect" name="Choose Page">
  <option value='' disabled selected hidden>Choose Page</option>
  <option value='/page-1'>Page 1</option>
  <option value='/page-2'>Page 2</option>
  <option value="allPages" >Custom Page</option>
</select>

$('#pageSelect').change(function(event) { 
    var pagesvalueselect = $(this).val(); 
    if(pagesvalueselect=="allPages"){ 
        $('#siteSaleModal').modal("show"); //Open Modal
    } else {
        location = pagesvalueselect;
    }
});


选择页面
第1页
第2页
自定义页
$（'#pageSelect'）。更改（函数（事件）{
var pagesvalueselect=$（this.val（）；
如果（页面值选择==“所有页面”）{
$（'siteSaleModal'）.modal（“show”）；//打开模式
}否则{
位置=页面值选择；
}
});

您的代码在没有
event.preventDefault（）和
onchange
属性的情况下运行良好

<select id="pageSelect" name="Choose Page">
  <option value='' disabled selected hidden>Choose Page</option>
  <option value='/page-1'>Page 1</option>
  <option value='/page-2'>Page 2</option>
  <option value="allPages" >Custom Page</option>
</select>

$('#pageSelect').change(function(event) { 
    var pagesvalueselect = $(this).val(); 
    if(pagesvalueselect=="allPages"){ 
        $('#siteSaleModal').modal("show"); //Open Modal
    } else {
        location = pagesvalueselect;
    }
});


选择页面
第1页
第2页
自定义页
$（'#pageSelect'）。更改（函数（事件）{
var pagesvalueselect=$（this.val（）；
如果（页面值选择==“所有页面”）{
$（'siteSaleModal'）.modal（“show”）；//打开模式
}否则{
位置=页面值选择；
}
});

您是否尝试过将所有的
onchange
移动到jQuery事件中？它们都可以被触发。默认操作是指在没有连接事件处理程序的情况下通常发生的操作。既然你有事件处理程序，它就会触发它们。由于您在“change”上设置了两个单独的处理程序，我建议您将它们转换为一个处理程序，该处理程序具有重定向或不重定向的智能。您是否尝试将所有
onchange
移动到jQuery事件中？它们都可以被触发。默认操作是指在没有连接事件处理程序的情况下通常发生的操作。既然你有事件处理程序，它就会触发它们。由于您在“更改”上设置了两个单独的处理程序，我建议您将它们转换为一个处理程序，该处理程序具有重定向或不重定向的智能。