`
lovelimx
  • 浏览: 20518 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

jquery获取值

阅读更多

 

<table border="1" bordercolor="black" cellspacing="0" align="center" cellpadding="5">
				<thead>
					<tr>
						<td>
							产品编号
						</td>
						<td>
							产品名称
						</td>
						<td>
							产品描述
						</td>
						<td>
							父类
						</td>
						<td>
							增加子类别
						</td>
						<td>
							编辑
						</td>
						<td>
							删除
						</td>
					</tr>
				</thead>
				<c:forEach items="${pageBean.queryResult.resultList}" var="productType">
					<tr class="productName">
						<td class="productTypeId">
							${productType.id }
						</td>
						<td class="productTypeName">
							${productType.name }
						</td>
						<td>
							${productType.note }
						</td>
						<td class="parentTypeId">
							<c:if test="${!empty productType.parentType}">${productType.parentType.name}</c:if>
						</td>
						<td>
							<a href="#dialog" name="addChildProductType">增加</a>
						</td>
						<td class="td">
							<input name="#update" type="button" value="编辑" />
						</td>
						<td>
							<a name="deleteProductType" href="controller/product/productType!deleteProductType.action?productType.id=${productType.id} ">删除</a>
						</td>
					</tr>
				</c:forEach>
			</table>

 在点击“编辑”按钮之后,我想获取“编辑”按钮相对应的那行:

 

<td class="parentTypeId">
							<c:if test="${!empty productType.parentType}">${productType.parentType.name}</c:if>
						</td>
 

里面的html文本值;我的写法是这样的:

 

var parentTypeName = $(this).parent().parent()
								.children(".parentTypeId").html();
						alert(parentTypeName);

 但是提示框显示的是null(我调试的时候是选择那些有值的),我觉得我的问题应该是这段javascript有问题。请朋友赐教。我的想法是这样的:$(this)得到的是

 

 

<input name="#update" type="button" value="编辑" />

 $(this).parent()得到的是

 

 

<td class="td">
							<input name="#update" type="button" value="编辑" />
						</td>

 $(this).parent.parent()得到的是

 

 

<tr class="productName">
						<td class="productTypeId">
							${productType.id }
						</td>
						<td class="productTypeName">
							${productType.name }
						</td>
						<td>
							${productType.note }
						</td>
						<td class="parentTypeId">
							<c:if test="${!empty productType.parentType}">${productType.parentType.name}</c:if>
						</td>
						<td>
							<a href="#dialog" name="addChildProductType">增加</a>
						</td>
						<td class="td">
							<input name="#update" type="button" value="编辑" />
						</td>
						<td>
							<a name="deleteProductType" href="controller/product/productType!deleteProductType.action?productType.id=${productType.id} ">删除</a>
						</td>
					</tr>

 

最后

 

 $(this).parent().parent()	.children(".parentTypeId").html();

 获得的是

 

 

<td class="parentTypeId">
							<c:if test="${!empty productType.parentType}">${productType.parentType.name}</c:if>
						</td>

 的节点值。这么想哪里有错?

 

 

解决这个问题的完整代码:

 

<div id="table">
			<table border="1" bordercolor="black" cellspacing="0" align="center" cellpadding="5">
				<thead>
					<tr>
						<td>
						</td>
						<td>
							产品编号
						</td>
						<td>
							产品名称
						</td>
						<td>
							产品描述
						</td>

						<td>
							父类名称
						</td>
						<td>
							增加子类别
						</td>
						<td>
							编辑
						</td>
						<td>
							删除
						</td>
					</tr>
				</thead>
				<c:forEach items="${pageBean.queryResult.resultList}" var="productType">
					<tr class="productName">
						<td class="parentTypeId">
							<c:if test="${!empty productType.parentType}">
								<input type="hidden" value="${productType.parentType.id}" />
							</c:if>
						</td>
						<td class="productTypeId">
							${productType.id }
						</td>
						<td class="productTypeName">
							${productType.name }
						</td>
						<td>
							${productType.note }
						</td>

						<td class="parentTypeName">
							<c:if test="${!empty productType.parentType}">${productType.parentType.name}</c:if>
						</td>
						<td>
							<input name="#add" type="button" value="添加"></input>
						</td>
						<td>
							<input name="#update" type="button" value="编辑" />
						</td>
						<td>
							<input name="#delete" type="button" value="删除" />
							<%--<a name="deleteProductType" href="controller/product/productType!deleteProductType.action?productType.id=${productType.id} ">删除</a>
						--%>
						</td>
					</tr>
				</c:forEach>
			</table>
		</div>

 

 

 

<div id="update" class="window">
			<img class="close" alt="close" src="/sports/images/greenAcross.gif">
			<form name="updateProductType" action="controller/product/productType!updateProductType.action" method="post">
				<table>
					<caption>
						添加产品子类型
					</caption>
					<tr>
						<td>
							产品父类型:
						</td>
						<td>
							<select name="select">

							</select>
						</td>
					</tr>
					<tr>
						<td>
							产品类型名称:
						</td>
						<td>
							<input id="productTypeName" type="text" name="productType.name">
						</td>
					</tr>
					<tr>
						<td>
							产品类型备注:
						</td>
						<td>
							<input id="productTypeNote" type="text" name="productType.note">
						</td>
					</tr>
					<tr>
						<td>
							<br />
							<input type="submit" name="" value="submit">
						</td>
						<td>
							<br />
							<input type="reset" name="" value="reset">
						</td>
					</tr>
				</table>
			</form>
		</div>
 

对应的jquery代码:

 

$('input[name=#update]').click(function(e) {
		var parentTypeId = $(this).parent().parent().children(".parentTypeId")
				.children().attr("value");
		var currentElement = $(this).parent().parent()
				.children(".parentTypeName");
		var parentTypeName = currentElement.html();
		var productTypeName = currentElement.prev().html();
		var productTypeNote = currentElement.prev().prev().html();
		// $("#productTypeName").attr("value", "cccccc");
		// $("#productTypeNote").attr("value", "dddddd");
		alert((productTypeName).toString());
		$("#productTypeName").attr("value", productTypeName);
		$("#productTypeNote").attr("value", "eeeeeee");
		alert(productTypeName);
		var id = $(this).attr('name');
		location(id);
		$(id).fadeIn(2000);

		$.ajax({
					type : "post",
					dataType : "json",
					url : "controller/product/productType!getIdAndName.action",
					success : function(data, textStatus) {
						var select = $("select[name=select]");
						var option = "";

						// var parentTypeName = $(this).parent().parent()
						// .children(".parentTypeId").html();
						// alert(parentTypeName);
						// var productType = eval("(" + data + ")");
						option += "<option value=\"" + parentTypeId + "\">"
								+ parentTypeName + "</option>";
						for (var i = 0; i < data.result; i++) {
							option += "<option value=\""
									+ data.rows[i].productId + "\">"
									+ data.rows[i].productTypeName
									+ "</option>";
						}
						select.html(option);
					},
					complete : function(XMLHttpRequest, textStatus) {
						// HideLoading();
						// alert("complete");
					},
					error : function() {
						alert("error");
					}
				});
	});
 但是新问题来了:上面代码的这句并不能正确赋值,截图在附件
  • 大小: 22.3 KB
分享到:
评论

相关推荐

    jquery获取表单值

    使用jQuery获取文本框的值非常简单: ```javascript var textVal = $("#text_id").val(); // 使用.val()方法获取值 ``` **注意:** `.val()` 方法是用来获取或设置表单元素的值的,而 `.attr("value")` 是用来获取...

    jquery获取form表单input元素值的简单实例

    在本篇内容中,我们将详细探讨如何使用jQuery来获取form表单中input元素的值,包括文本框、复选框、单选按钮等不同类型input元素的值获取方法。通过jQuery提供的val()方法和attr()方法,我们可以轻松获取或设置input...

    jQuery获取table下某一行某一列的值实现代码

    从提供的文件内容中,我们可以提取以下关于jQuery获取表格中某一行某一列值的知识点: 1. jQuery选择器的使用:在文中,通过使用选择器 $(".div") 找到了包含多个表格的div元素。这说明了jQuery选择器用于选取页面...

    jQuery实现获取元素索引值index的方法

    在使用jQuery进行前端开发时,我们常常需要获取元素在集合中的索引值以便进行进一步的操作。jQuery作为一个强大的JavaScript库,提供了一系列方法来简化DOM操作,其中“.index()”方法便是用于获取元素索引值的一种...

    jquery获取checkbox选中的值

    以上就是使用jQuery获取和操作checkbox选中值的基本方法。这些技巧在处理多选数据、用户交互和表单提交时非常有用。通过结合CSS类和DOM操作,可以进一步完善用户体验,如添加视觉反馈或动画效果。在实际项目中,确保...

    Jquery获取Select标签的值

    ### Jquery 获取 Select 标签的值 在前端开发中,使用 jQuery 框架能够极大地简化 DOM 操作,使得获取或设置 HTML 元素的属性变得更加容易。本篇文章将详细介绍如何利用 jQuery 来获取 Select 标签的值以及相关的...

    用Jquery获取table中td的值

    在"用Jquery获取table中td的值"这个场景下,可能需要遍历整个表格获取所有`td`的值。可以使用`.each()`方法来实现: ```javascript $("table tr td").each(function(index, element) { var value = $(element)....

    Jquery 获取input 值

    根据提供的文件信息,我们可以总结出一系列关于如何使用 jQuery 来获取不同类型的输入元素(如 radio 按钮、checkbox 和 select 下拉列表)值的方法。接下来,我们将详细地解析这些方法,并提供相应的代码示例。 ##...

    Jquery 获取url参数

    在处理URL参数时,jQuery提供了一些便利的方法,使得开发者能够轻松地获取和解析URL中的查询字符串。本篇文章将深入探讨如何使用jQuery来获取URL参数,并给出实际的应用示例。 首先,我们需要理解URL的组成部分。一...

    jQuery操作checkbox并获取选中值

    本文将详细讲解如何使用jQuery来操作checkbox,并实现全选、全不选、反选以及获取选中值这四个核心功能。 ### 一、jQuery选择器与checkbox操作 在jQuery中,我们可以使用不同的选择器来选取页面上的checkbox元素。...

    jquery获取表单元素的方法

    本文将详细解析如何使用jQuery获取表单元素的各种值,包括文本框(TEXT)、文本区域(AREA TEXT)、复选框(CHECKBOX)、单选按钮(RADIO)、下拉列表(SELECT)以及表格(TABLE)中的数据。 ### 文本框(TEXT) ...

    jquery获取input表单值的代码

    jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 获取一组radio被选中项的值 var item = $(‘input[name=items][checked]’).val(); 获取select被选中项的文本 var ...

    JQuery获取table一列值

    ### JQuery 获取 Table 一列值的方法详解 在 Web 开发中,经常需要处理表格数据,尤其是在需要对表格中的数据进行批量操作时。使用 JQuery 可以非常方便地获取表格(`&lt;table&gt;`)中某一列的所有值。下面将详细介绍...

    JQuery获取input控件值.docx

    - 对于`&lt;input type="radio"&gt;`,可以通过检查哪个被选中来获取值。如果有一个name为`items`的radio组,获取选中项的值可使用:`$("input[@type=radio][@name=items][@checked]").val()`。 - 设置radio选中项,可以...

    jquery 获取单选按钮的值

    本篇文章将详细讲解如何在jQuery中获取单选按钮(radio button)的值。 首先,我们需要了解HTML中的单选按钮是如何定义的。在HTML中,单选按钮通常使用`&lt;input&gt;`标签的`type="radio"`属性来创建。每个单选按钮都有...

    用jquery获取select标签中选中的option值及文本的示例

    - 方法二:通过id选择器直接获取select标签,并使用.find()方法配合":selected"伪类选择器找到当前选中的option,然后使用.val()方法获取值。代码为`$("#sel").find("option:selected").val();` 这两种方法用于...

    jquery获取下拉列表的值为null的解决方法

    在jQuery获取值的代码中,我们只需要判断这个值是否存在即可,如下: ```javascript var selectedValue = $("#ddlType").val(); if (selectedValue) { // 用户选择了一个选项,执行相关逻辑 } else { // 用户未...

    jquery获取array

    本文将详细介绍如何使用 jQuery 来获取具有相同名称的 input 元素,并将其值存储到一个数组中。 #### 一、jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,其设计宗旨是“write less, do more”,即用更少...

    jQuery获取Select选择的Text和_Value

    jQuery 也提供了方法来获取表单元素的值。 1. 获取 Radio 的值: 可以使用 `$('input[@name=items][@checked]').val()` 方法获取 Radio 的值。 2. 获取 Select 被选中项的文本: 可以使用 `$("select[@name=...

Global site tag (gtag.js) - Google Analytics