html:

<select id="pageSelect">

  <option value="1" selected onclick="openNewPage()">页面1</option>

  <option value="2" onclick="openNewPage()">页面2</option>

</select>

js:

<script type="text/javascript">

function openNewPage(){

  var value = $("# pageSelect option:select").value;

  if(value == "1"){

    //弹出页面1

  }else{

    //弹出页面2

  }

}

</script>

以上,在高版本浏览器可以正常运行,但是在低版本浏览器,option的onclick事件无效,因为低版本浏览器不支持option的onclick事件

解决方法:

可以在select添加onclick事件,不采用onchange事件,是因为选项内容值必须改变,才能触发onchange事件;

但是,在select中添加onclick事件,会导致你点击这个选择框还没选择选项时,就会触发onclick事件,所以,添加onclick事件后,在js中也要进行处理

html:

<select id="pageSelect"  onclick="openNewPage(this)">

  <option value="1" selected>页面1</option>

  <option value="2">页面2</option>

</seelct>

js:

<script type="text/javascript">

//定义一个布尔类型变量,用于控制选择框的点击事件

var isSelect=true;

function openNewPage(value){

  var optionSelect= value.options[value.selectedIndex];

  if(value.value == optionSelect.value){

    isSelect = !isSelect

  } else {

    isSelect = true;

  }

  if(isSelect == true){

    if(value == "1"){

      //弹出页面1

    }else{

      //弹出页面2

    }

  }

}

</script>

参考网址:

https://blog.csdn.net/svtme/article/details/5149544

select中option的onclick事件失效的更多相关文章

  1. react中使用map时onClick事件失效

    分享一些踩过的坑 react中使用map时onClick事件失效 <span> { count.map( (item,index)=>{ return <span style= ...

  2. [转]iOS Safari 中click点击事件失效的解决办法

    iOS Safari 中click点击事件失效的解决办法 问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素 ...

  3. 下拉框select中option居中样式

    下拉框select中option居中样式 text-align:center;text-align-last:center;

  4. vue中router-link的click事件失效的解决办法

    title: vue中router-link的click事件失效的解决办法 toc: false date: 2018-12-04 16:28:49 categories: Web tags: vue ...

  5. IE下不支持option的onclick事件

    <select> <option onclick="test('www.hao123.com')"value="www.hao123.com" ...

  6. 解决iscroll5在手机页面上onclick事件失效

    Iscroll.js使用之后页面上面A标签的onclick事件无效了   解决办法 实例化IScroll的时候把preventDefault设为false,默认为true var myScroll; ...

  7. 有关attribute和property,以及各自对select中option的影响

    这个问题老生常谈,但是直到现在我依旧时常会把它搞混.下面列一些各自的特性.   attribute property 设置方法 option.setAttribute('selected', true ...

  8. Jquery 移除 html中绑定的onClick事件

    HTML绑定示例: <button class="edit" onClick="showTurnEdit(this)">编辑</button& ...

  9. Android ListView中Item点击事件失效解决方案

    欢迎关注公众号,每天推送Android技术文章,二维码如下:(可扫描) 在平常的开发过程中,我们的ListView可能不只是简单的显示下文本或者按钮,更多的是显示复杂的布局,这样的话,我们就得自己写布 ...

随机推荐

  1. docker 数据卷和docker数据卷容器以及数据卷的备份和还原

    一:数据卷 1.什么是数据卷 数据卷是通过特殊设计的目录,可以绕过联合文件系统,为一个或者多个容器提供服务,数据卷是在docker宿主机当中,数据卷可以是文件也可以是文件夹. 2.特点 1.数据卷在容 ...

  2. Hive JDBC:java.lang.RuntimeException: org.apache.hadoop.ipc.RemoteException(org.apache.hadoop.security.authorize.AuthorizationException): User: root is not allowed to impersonate anonymous

    今天使用JDBC来操作Hive时,首先启动了hive远程服务模式:hiveserver2 &(表示后台运行),然后到eclipse中运行程序时出现错误: java.sql.SQLExcepti ...

  3. QPushButton class

    Help on class QPushButton in module PyQt5.QtWidgets: class QPushButton(QAbstractButton) |  QPushButt ...

  4. linux下安装多个Tomcat

    编辑环境变量:vi /etc/profile 加入以下代码 ##########first tomcat########### CATALINA_BASE=/usr/local/src/tomcat ...

  5. lvds接口介绍

    1.项目简介 用索尼的imx264 sensor采集图像,在内部模数转换之后,由lvds接收,然后解码,最后送给后端显示 2.框图 imx264配置成从模式,由spi总线配置,需要由FPGA提供 行. ...

  6. JAVA如何利用Swiger获取Linux系统电脑配置相关信息

    最近开发java应用程序,涉及到获取Linux服务器相关配置的问题,特地网上搜寻了下,采用Swiger包可以直接获取,再次小结一下,以便于以后能方便使用,也便于其他童鞋们学习. 推荐大家参考链接:ht ...

  7. Win 7/10 安装Oracle 11g

    两个系统安装oracle的过程基本一致,注意安装时选桌面类(没有试过server,只有server类的操作系统选择server类) 安装过程:https://jingyan.baidu.com/alb ...

  8. react中的this.setState()

    修改组件的状态可以使用的一些方法: 1.比较常用的 this.setState({ message:"你好" }) 2.state更新是异步的时候 因为this.props和thi ...

  9. Activiti6-IdentityService(学习笔记)

    IdentityService并不依赖我们的流程部署文件,所以 直接放使用方法的测试代码了: public class IdentityServiceTest { private static fin ...

  10. MDS

    转载:https://blog.csdn.net/victoriaw/article/details/78500894 多维缩放(Multidimensional Scaling, MDS)是一组对象 ...