<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获取文本框的值非常简单: ```javascript var textVal = $("#text_id").val(); // 使用.val()方法获取值 ``` **注意:** `.val()` 方法是用来获取或设置表单元素的值的,而 `.attr("value")` 是用来获取...
在本篇内容中,我们将详细探讨如何使用jQuery来获取form表单中input元素的值,包括文本框、复选框、单选按钮等不同类型input元素的值获取方法。通过jQuery提供的val()方法和attr()方法,我们可以轻松获取或设置input...
从提供的文件内容中,我们可以提取以下关于jQuery获取表格中某一行某一列值的知识点: 1. jQuery选择器的使用:在文中,通过使用选择器 $(".div") 找到了包含多个表格的div元素。这说明了jQuery选择器用于选取页面...
在使用jQuery进行前端开发时,我们常常需要获取元素在集合中的索引值以便进行进一步的操作。jQuery作为一个强大的JavaScript库,提供了一系列方法来简化DOM操作,其中“.index()”方法便是用于获取元素索引值的一种...
以上就是使用jQuery获取和操作checkbox选中值的基本方法。这些技巧在处理多选数据、用户交互和表单提交时非常有用。通过结合CSS类和DOM操作,可以进一步完善用户体验,如添加视觉反馈或动画效果。在实际项目中,确保...
### Jquery 获取 Select 标签的值 在前端开发中,使用 jQuery 框架能够极大地简化 DOM 操作,使得获取或设置 HTML 元素的属性变得更加容易。本篇文章将详细介绍如何利用 jQuery 来获取 Select 标签的值以及相关的...
在"用Jquery获取table中td的值"这个场景下,可能需要遍历整个表格获取所有`td`的值。可以使用`.each()`方法来实现: ```javascript $("table tr td").each(function(index, element) { var value = $(element)....
根据提供的文件信息,我们可以总结出一系列关于如何使用 jQuery 来获取不同类型的输入元素(如 radio 按钮、checkbox 和 select 下拉列表)值的方法。接下来,我们将详细地解析这些方法,并提供相应的代码示例。 ##...
在处理URL参数时,jQuery提供了一些便利的方法,使得开发者能够轻松地获取和解析URL中的查询字符串。本篇文章将深入探讨如何使用jQuery来获取URL参数,并给出实际的应用示例。 首先,我们需要理解URL的组成部分。一...
本文将详细讲解如何使用jQuery来操作checkbox,并实现全选、全不选、反选以及获取选中值这四个核心功能。 ### 一、jQuery选择器与checkbox操作 在jQuery中,我们可以使用不同的选择器来选取页面上的checkbox元素。...
本文将详细解析如何使用jQuery获取表单元素的各种值,包括文本框(TEXT)、文本区域(AREA TEXT)、复选框(CHECKBOX)、单选按钮(RADIO)、下拉列表(SELECT)以及表格(TABLE)中的数据。 ### 文本框(TEXT) ...
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 获取一组radio被选中项的值 var item = $(‘input[name=items][checked]’).val(); 获取select被选中项的文本 var ...
### JQuery 获取 Table 一列值的方法详解 在 Web 开发中,经常需要处理表格数据,尤其是在需要对表格中的数据进行批量操作时。使用 JQuery 可以非常方便地获取表格(`<table>`)中某一列的所有值。下面将详细介绍...
- 对于`<input type="radio">`,可以通过检查哪个被选中来获取值。如果有一个name为`items`的radio组,获取选中项的值可使用:`$("input[@type=radio][@name=items][@checked]").val()`。 - 设置radio选中项,可以...
本篇文章将详细讲解如何在jQuery中获取单选按钮(radio button)的值。 首先,我们需要了解HTML中的单选按钮是如何定义的。在HTML中,单选按钮通常使用`<input>`标签的`type="radio"`属性来创建。每个单选按钮都有...
- 方法二:通过id选择器直接获取select标签,并使用.find()方法配合":selected"伪类选择器找到当前选中的option,然后使用.val()方法获取值。代码为`$("#sel").find("option:selected").val();` 这两种方法用于...
在jQuery获取值的代码中,我们只需要判断这个值是否存在即可,如下: ```javascript var selectedValue = $("#ddlType").val(); if (selectedValue) { // 用户选择了一个选项,执行相关逻辑 } else { // 用户未...
本文将详细介绍如何使用 jQuery 来获取具有相同名称的 input 元素,并将其值存储到一个数组中。 #### 一、jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,其设计宗旨是“write less, do more”,即用更少...
jQuery 也提供了方法来获取表单元素的值。 1. 获取 Radio 的值: 可以使用 `$('input[@name=items][@checked]').val()` 方法获取 Radio 的值。 2. 获取 Select 被选中项的文本: 可以使用 `$("select[@name=...