jQueryを使用してテキストエリアの値を取得および設定する方法

Question

私のフォームにテキストエディタがあります。テキストエリアで何かをクリックすると、テキストエリアのポップアップに同じ値が表示されます。

これは私が結果を設定する必要が私のテキストエリアである：私は結果を取得する必要があります

<textarea name="content" class="text_editor" id="textarea" ></textarea> 

表示ページ：

<div class="form-group mod_mr20"> 
    <label class="col-md-3 control-label">Notice Description</label> 
    <div class="col-md-9 col-md-offset-1 hidden_color"> 
     <p></p>//display view here 
    </div> 
</div> 

これは私のプレビューボタンです：

<button class="btn btn-primary mr5" data-toggle="modal" type="button" name="submit" data-target="#pre_view" >PREVIEW</button> 

ポップアップユーザーの表示結果の表示後、これらの値を編集することはできません

私はあなたがこれを取得しようとしていると思う

Answer 1

これを試してみてください、

、

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

<script> 
    $(document).ready(function(){ 
     $("#preview").on('click',function(){ 
      $('.col-md-9.col-md-offset-1.hidden_color > p').html($('#textarea').val()); 
     }); 
    }); 
</script> 

<textarea name="content" class="text_editor" id="textarea" ></textarea> 
<button type="button" class="btn btn-info btn-lg" id="preview" data-toggle="modal" data-target="#myModal">Preview</button> 
<!--Your Model--> 
<div class="form-group mod_mr20"> 
    <label class="col-md-3 control-label">Notice Description</label> 
    <div class="col-md-9 col-md-offset-1 hidden_color"> 
     <p></p>//display view here 
    </div> 
</div> 

Answer 2

あなたは、このコードを試すブートストラップを使用する場合：

$(document).on('show.bs.modal','#Your-modal-popup-id', function() { 
    alert('hi'); 
    $(e.currentTarget).find('.hidden_color p').html($("#textarea").val()); 
})