将包含html标签的div的内容复制到隐藏输入中

时间:2013-10-24 17:23:42

标签: javascript jquery html forms

希望简单的问题,

我想要做的是抓取我的div的内容,包括任何子元素的html标签,并在每次按下另一个输入字段中的键时将其插入到形式的隐藏输入中

e.g。如果我的div是:

<div><p>Hello</p></div>

我想要复制:

<p>Hello</p>

作为字符串

我试过了:

$(document).ready(function(){
    $('#textarea').keyup(function() {
        $('#hidden-input').html($('#div'));
    });
});

唯一的问题是我的隐藏输入的内容包含div和div的竞争,例如它看起来像这样:

<input type="hidden" id="hidden-input" name="foo" value="bar">
    <div> (DIV CONTENTS) </div>
</input>

我只想从上面得到(DIV CONTENTS),没有div。像这样:

<input type="hidden" id="hidden-input" name="foo" value="bar">
    (DIV CONTENTS)
</input> 

3 个答案:

答案 0 :(得分:2)

简单地做:

 $(document).ready(function(){
     $('#textarea').keyup(function() {
         $('#hidden-input').html($('#div').html());
     });
 });

答案 1 :(得分:0)

</input>是无效的输入结束标记。输入是自封闭标记,因此无需</,因此您可以意识到输入没有HTML内容,而是 value=""

因此我建议您使用隐藏的<textarea id="hidden-input"></textarea>元素

$(function(){ // DOM ready 
    $('#textarea').keyup(function() {
        var copy = $('#div').html();
        $('#hidden-input').html( copy );
    });
});

<小时/> 我不明白你的问题是:

  

每次我按下另一个输入字段中的某个键

你有多个输入字段,而不是在ID中使用$('#textarea').keyup( 而是一个常见的className。

这是一个来自你要求的演示(或者至少你是如何解释的)

<强> LIVE DEMO

完全没有意义,

所以我建议你重新制定你的问题。

答案 2 :(得分:-1)

问题不符合逻辑。我们可以给输入字段赋值,val函数用于此

val():此方法通常用于设置表单字段的值。 http://api.jquery.com/val/

$(document).ready(function(){
    $('#textarea').keyup(function() {
        $('#hidden-input').val($('div').html());
    })
});