0 0

jquery触发select的change事件失效3

jquery在页面第二次加载的时候触发不了下拉框的change事件,启动tomcat,地址栏输入http://localhost:8080/aa/list.jsp时能够触发下拉框的change事件,但是从servlet过来后就不起作用了,怎么回事?
-------------------
list.jsp页面
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>信息界面</title>
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		
		$("#sel_emp").live('change',function(){
			var value = $('#sel_emp').val();
			alert(value);
			window.location = "/aa/servlet/Test1Servlet";
		});
		
	});

</script>
</head>
<body>
<select id="sel_emp">
	<option value="1">编号</option>
	<option value="2">姓名</option>
</select>
	<table border="1">
		<tr>
			<th>编号</th>
			<th>姓名</th>
		</tr>
		<c:forEach items="${list }" var="element">
		<tr>
			<td>${element.uid }</td>
			<td>${element.username }</td>
		</tr>
		</c:forEach>
	</table>
</body>
</html>

------------------------servlet
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		
		
		Employee employee_01 = new Employee();
		employee_01.setUid("1");
		employee_01.setUsername("张三");
		
		Employee employee_02 = new Employee();
		employee_02.setUid("2");
		employee_02.setUsername("李四");
		
		List<Employee> list = new ArrayList<Employee>();
		list.add(employee_01);
		list.add(employee_02);
		
		request.setAttribute("list", list);
		
		request.getRequestDispatcher("/list.jsp").forward(request, response);
		

问题补充:
Rainbow702 写道
你是指,在从servlet 跳转至该页面后,点击下拉菜单,选择一个值的时候,不会触发这下面这个:
引用
# function(){ 
#          
#         $("#sel_emp").live('change',function(){ 
#             var value = $('#sel_emp').val(); 
#             alert(value); 
#             window.location = "/aa/servlet/Test1Servlet"; 
#         }


是么?

是的

问题补充:
Rainbow702 写道
你是指,在从servlet 跳转至该页面后,点击下拉菜单,选择一个值的时候,不会触发这下面这个:
引用
# function(){ 
#          
#         $("#sel_emp").live('change',function(){ 
#             var value = $('#sel_emp').val(); 
#             alert(value); 
#             window.location = "/aa/servlet/Test1Servlet"; 
#         }


是么?

就是第二次进入页面的时候

问题补充:
Rainbow702 写道
你是指,在从servlet 跳转至该页面后,点击下拉菜单,选择一个值的时候,不会触发这下面这个:
引用
# function(){ 
#          
#         $("#sel_emp").live('change',function(){ 
#             var value = $('#sel_emp').val(); 
#             alert(value); 
#             window.location = "/aa/servlet/Test1Servlet"; 
#         }


是么?

直接从servlet过来也不得行,但是如果用response.sendRedirect就没问题,那样我就得用request.getSession.setAttribute了,反正是第二次进入页面就触发不了

问题补充:
Rainbow702 写道
你试试在 ready方法里,只写一句 alert 来测试一下,看看从servlet中forward过来的时候,会不会再次触发 ready 事件。

还是不行,只要是第二次进页面就触发不了

问题补充:
Rainbow702 写道
你是从list.jsp页面提交一个请求给servlet 处理,处理完了之后又让这个servlet 跳回至这个list.jsp,是么?

是这样的,我就是写个简单的jquery,刚学,就来个这个问题,我晕哦

问题补充:
Rainbow702 写道
引用
是这样的

那你想这过程当中,list.jsp 被加载了几次呢?一次哇,只有一次ready事件被触发。你把 live 改为 bind 试试,看看能不能再次触发呢。
$(document).ready(function(){
  $("sel_emp").bind({
    change:function(){var value = $('#sel_emp').val();  alert(value);}
  });
});

一样不行

问题补充: 悲催啊,这么简单一个东西居然不得行

问题补充:
Rainbow702 写道
引用
悲催啊,这么简单一个东西居然不得行
我之前基本使用原生的JS,框架之类的用的不多,帮不了你啊,惭愧。

谢谢哈,我去找看

问题补充:
AngelAndAngel 写道
  改成 
$("#sel_emp").change(function(){   
           var value = $(this).val();   
            alert(value);   
            window.location = "/aa/servlet/Test1Servlet";   
        });

还是一样的效果

问题补充:
AngelAndAngel 写道

路径问题
改成
<%
String path=request.getContextPath();
%>
<script type="text/javascript" src="<%=path%>/js/jquery-1.4.4.min.js"></script>

天啊,哥,我崇拜你,崇拜的崇,崇拜的拜
2011年9月02日 10:17

9个答案 按时间排序 按投票排序

0 0

采纳的答案


路径问题
改成
<%
String path=request.getContextPath();
%>
<script type="text/javascript" src="<%=path%>/js/jquery-1.4.4.min.js"></script>

2011年9月02日 13:31
0 0

 

2011年9月02日 13:35
0 0

  改成 

$("#sel_emp").change(function(){   
           var value = $(this).val();   
            alert(value);   
            window.location = "/aa/servlet/Test1Servlet";   
        });

2011年9月02日 13:28
0 0

引用
悲催啊,这么简单一个东西居然不得行
我之前基本使用原生的JS,框架之类的用的不多,帮不了你啊,惭愧。

2011年9月02日 12:50
0 0

引用
一样不行

那你咨询一下 AngelAndAngel 吧。你随便找个问题,就可以找到他的踪影。

2011年9月02日 12:49
0 0

引用
是这样的

那你想这过程当中,list.jsp 被加载了几次呢?一次哇,只有一次ready事件被触发。你把 live 改为 bind 试试,看看能不能再次触发呢。
$(document).ready(function(){
  $("sel_emp").bind({
    change:function(){var value = $('#sel_emp').val();  alert(value);}
  });
});

2011年9月02日 12:26
0 0

你是从list.jsp页面提交一个请求给servlet 处理,处理完了之后又让这个servlet 跳回至这个list.jsp,是么?

2011年9月02日 12:11
0 0

你试试在 ready方法里,只写一句 alert 来测试一下,看看从servlet中forward过来的时候,会不会再次触发 ready 事件。

2011年9月02日 11:52
0 0

你是指,在从servlet 跳转至该页面后,点击下拉菜单,选择一个值的时候,不会触发这下面这个:

引用
# function(){ 
#          
#         $("#sel_emp").live('change',function(){ 
#             var value = $('#sel_emp').val(); 
#             alert(value); 
#             window.location = "/aa/servlet/Test1Servlet"; 
#         }


是么?

2011年9月02日 11:22

相关推荐

    JQuery触发radio或checkbox的change事件

    在JQuery中,当给radio或checkbox添加一个change事件时,如果它的值发生变化就会触发change事件;本文将详细介绍如何利用JQuery触发Checkbox的change事件需要了解的朋友可以参考下

    jQuery为动态生成的select元素添加事件的方法

    在这个例子中,为ID以`"sl_0"`开头的select元素绑定了一个`change`事件,当用户改变了选项时,会触发一个弹窗显示“你点击了下拉框”。 8. 总结:通过使用jQuery的事件委托技术,开发者可以有效地为动态生成的元素...

    jquery.selectbox.js select下拉菜单美化代码

    jquery.selectbox.js select下拉菜单美化代码 jquery.selectbox.js select下拉菜单美化代码 jquery.selectbox.js select下拉菜单美化代码

    jQuery实现长按按钮触发事件的方法

    jQuery实现长按按钮触发事件的方法是移动设备和网页应用开发中的一项常见技术,主要目的是为了增强用户交互体验,尤其是在触摸屏设备上。通过长按按钮触发特定事件,开发者可以为用户提供更丰富的交互方式,比如在...

    layui问题之模拟select点击事件的实例讲解

    - **触发select事件**: 通过查看layui的源码,了解select事件的实现原理。 - 找到select元素之后的div.layui-select-title节点的子元素,这个子元素可能是input或者i,然后实现点击事件。 - 点击后下拉框会出现,...

    [转]Jquery操作select 收藏

    4. **触发事件**:jQuery提供了丰富的事件处理,如`.on()`用于绑定事件监听器。例如,监听下拉框的改变事件: ```javascript $('select').on('change', function() { console.log('Selected value changed to:', ...

    jquery 超级select插件 v4.0版本

    《jQuery超级Select插件v4.0版本详解》 在Web开发中,下拉选择框(Select)是最常见的表单元素之一,但在某些场景下,普通的Select可能无法满足复杂的交互需求,例如多选、搜索过滤、自定义样式等。这时,jQuery...

    jquery select2组件

    此外,`Select2`还提供事件监听、方法调用等功能,如`open`、`close`事件,以及`destroy`、`val`等方法,以满足不同场景的需求。 ### 5. 更新与兼容性 随着版本迭代,`Select2`不断优化性能和增加新功能。目前最新...

    jquery实现select互斥联动

    为每个`select`元素添加`change`事件监听器,当用户更改选项时触发相应函数。 3. 逻辑处理:在`change`事件的回调函数中,获取当前选中的值,并根据预设的联动规则更新其他`select`元素的选项。这可能涉及清除某些...

    jquery模拟select

    /** * 模拟select * @param {box,tiggle} * @param box 父级别容器[模拟select最外围标签] * @param tiggle 展开事件 [*click | mouseover | 其他dom事件] ...* change(function(){}) 等同于select默认事件change */

    基于jQuery的select下拉框选择触发事件实例分析

    本文实例讲述了基于jQuery的select下拉框选择触发事件实现方法。分享给大家供大家参考,具体如下: 我一直以来都认为,select 下拉框选择对选项 options 使用 onclick 注册事件即可,如下: &lt;select&gt; 选项一...

    javascript的onchange事件与jQuery的change()方法比较

    改变一下思路变成键盘按键事件,如下: ”txtName” runat=”server” xss=removed&gt;&lt;/asp&gt; 这里有一点毛病是,你复制粘贴的内容,无法触发这个事件。下面是相关的一些代码: 代码如下: function fNameChange(){ if($...

    cool的JQuery自定义select

    "cool的JQuery自定义select"就是为了解决这个问题而出现的一个插件,它通过jQuery库对select元素进行了美化,提供了简洁且易于使用的界面,增强了用户体验。 jQuery是一款强大的JavaScript库,它简化了JavaScript的...

    jquery实现select带模糊搜索下拉选择框

    在网页开发中,`jQuery` 是一款非常流行的 JavaScript 库,它简化了DOM操作、事件处理、动画制作等任务。本教程将详细讲解如何使用 `jQuery` 实现一个具有模糊搜索功能的下拉选择框,以提升用户在交互时的体验。 ...

    JQuery插件select2

    总之,jQuery插件Select2是前端开发中不可或缺的工具之一,它极大地提高了用户选择交互的质量,使得原本单调的`&lt;select&gt;`元素焕发新生。通过学习和掌握Select2的使用,开发者可以为用户提供更加高效、美观的界面。

    jquery.selectlist.js插件实现的下拉框美化特效

    `jquery.selectlist.js`插件是基于JavaScript库jQuery构建的,jQuery是一个轻量级的、高性能的库,使得开发者能够更容易地进行DOM操作、事件处理、动画效果以及Ajax交互。通过利用jQuery的强大功能,`jquery.select...

    jQuery And Select2 Demo.zip

    在本文中,我们将深入探讨jQuery库以及Select2插件的使用,如何利用它们来实现一个功能丰富的下拉框,特别是用于复选功能。这将帮助Web开发者创建更加用户友好的界面,提高用户体验。 jQuery是一个广泛使用的...

    关于jquery中动态增加select,事件无效的快速解决方法

    当新的`select`元素被添加并且用户改变其选项时,`change`事件会被正确触发。注意,`live`方法在jQuery 1.7之后被弃用了,取而代之的是`on`方法,它提供更强大的功能和更好的性能。使用`on`方法,你可以这样绑定事件...

    jQuery实现select样式美化 jQselect.js

    "jQuery实现select样式美化 jQselect.js" 就是这样一种解决方案,它利用jQuery库来对传统的`&lt;select&gt;`标签进行样式定制,以提供更加丰富的视觉效果。 jQuery是一个强大的JavaScript库,它简化了HTML文档遍历、事件...

Global site tag (gtag.js) - Google Analytics