如何使用包含id、name和javascript的jQuery克隆元素
How to clone element with jQuery containing id, name and javascript?
我有一个要复制的表。此表包含id和名称的输入。此表还包含javascript。
<table>
<tr>
<td>
<input type="text" id="text_1" name="text_1"/>
<script>
jQuery( "#text_1" ).on( "change", function() {
alert("do...");
});
</script>
</td>
</tr>
</table>
我可以很容易地将id和名称从text_1更改为text_2,如下所示:
jQuery(clone).find("*").each(function(index, element) {
if(element.id)
{
var matches = element.id.match(/(.+)_'d+/);
if( matches && matches.length >= 2 ) {
element.id = matches[1] + "_" + demandeNumber;
}
}
if(element.name)
{
var matches = element.name.match(/(.+)_'d+/);
if( matches && matches.length >= 2 ) {
element.name = matches[1] + "_" + demandeNumber;
element.value = "";
}
}
});
但是我如何更改javascript的id:
jQuery( "#text_1" ).on( "change", function() {
alert("do...");
});
至
jQuery( "#text_2" ).on( "change", function() {
alert("do...");
});
我已经尝试更改这一点,但如果克隆的输入发生更改,则不会引发事件。
你能帮我吗?
谢谢。
请参阅Jquery方法.clone():
http://api.jquery.com/clone/
使用:
//That true param indicates that event handlers should also be cloned
var cloneElement = $("yourElement").clone(true);
http://jsfiddle.net/sLBgY/5/
好的,但我已经为我的输入创建了宏(速度宏),select和其他字段和脚本都集成在宏上,以避免像这样在宏外调用javascript
#macro( textField $hasTr $hasTd $hasLabel $hasError $label $attr $size $maxLength $helpText $isReadonly $isMandatory $autofocus $beanValue $bean )
#if( $hasTr ) <tr> #end
#if( $hasTr || $hasTd ) <td class="label"> #end
#if( $hasLabel )
#if( !$isReadonly ) <label for="$attr"> #end #text("$label") #if( !$isReadonly ) </label> #end #if( $isMandatory ) <span class="mandatory">*</span> #end
#end
#if( $hasTr || $hasTd ) </td> #end
#if( $hasTr || $hasTd ) <td class="value"> #end
#if( $isReadonly )
<input type="hidden" id="$attr" name="$attr" value="$!escUtils.escapeHtml( $!beanValue )" />
<span class="readonly">$!beanValue</span>
#else
<input type="text" maxlength="$maxLength" id="$attr" name="$attr" value="$!escUtils.escapeHtml( $!beanValue )" size="$size" #if( $autofocus ) autofocus="autofocus" #end />
#end
#if( $helpText != "" )
<img src="#media("picto/16x16/help.png")" id="${attr}_image" alt="" />
<script>
#set( $imageId = "${attr}_image" )
jQuery( "#$imageId" ).qtip( {
prerender: true,
content : { text : "$!helpText" },
show: { delay: 1 },
effect: false,
position: { my: 'top left', target: 'mouse', viewport: jQuery(window), adjust: { x: 10, y: -15 } },
style: { classes: 'qtip-lgcf qtip-rounded' }
});
</script>
#end
#if( $hasTr || $hasTd ) </td> #end
#if( $hasTr || $hasTd ) <td class="error"> #end
#if( $hasError ) #if( $bean.errors.containsKey( "$attr" ) ) #set( $errorValue = $!bean.errors.get("$attr") ) <span>#text("$errorValue")</span> #end #end
#if( $hasTr || $hasTd ) </td> #end
#if( $hasTr ) </tr> #end
完
我应该能够在脚本中更新每个字段的id,并重新加载javascript。。。
有两种方法。1.使用正则表达式并用新id替换旧id。2.去掉javascript块,创建如下函数:
<script>
onTextChange = function(obj)
{
alert("do....");
}
</script>
并使用文本框的更改事件调用此函数
<input type="text" id="text_1" name="text_1" onChange="onTextChange(this);"/>
相关文章:
- Firefox赢得了'不会显示我添加的jquery元素,但Chrome会显示
- 使用返回函数sinde.attr()jquery元素
- Wooccommerce所有JS和Jquery元素都未加载
- 追加JQuery元素和Angular
- 如何获取jQuery集合中的第k个元素..作为JQUERY元素
- 是否存在jQuery元素选择库的最小化版本
- 不能同时通过类和数字 ID 选择 jquery 元素
- 为什么jquery元素在ipad上没有响应
- Jquery元素用法
- 用于获取jQuery元素或值的方法
- 淡入淡出切换jquery元素
- 用于查找在 jQuery 元素集中具有特定类的元素的索引的单行代码
- 选择具有由 data() 设置的某个值的 JQuery 元素
- Jquery 元素的高级过滤
- 链接到另一个带有jQuery元素的页面
- jQuery:通过 .wrap() 添加到 DOM 的 jQuery 元素上的切换类
- 将字符串转换为 jquery 元素并将其追加到 DOM 中
- 与“click”事件一起存储的jQuery元素未按要求工作
- 在哈希数组中保存对 jquery 元素的引用
- 如何从核心JavaScript选择中获取jquery元素