javascript - 入力テキストフィールドをスパン内のテキストに置き換えるにはどうすればよいですか?

Question

テキストフィールドに値を入力した後、テキストフィールドを編集不可のフィールドに置き換えたいです。

<input type="text" id="text" value="">
<input type="button" id="btn" value="click">

テキストフィールドにデータ値を入力してボタンをクリックした後、これらのテキストフィールドとボタンをスパン内のテキストに置き換えたいと思います。

<span id="changedText"></span>

Jqueryでそれを行うにはどうすればよいですか? 前もって感謝します。

score 1 · Accepted Answer

最初に入力要素で値を取得する必要があります。

var data = $("#text").val();

次に、スパン要素を作成し、入力をそれに置き換えます

$("#text").replaceWith('<span id="changedText">'+data+'</span>')

これはすべて、ユーザーがボタンをクリックしたときに発生します

$("#btn").click(function(){
     var data = $("#text").val();
     $("#text").replaceWith('<span id="changedText">'+data+'</span>') 
});

score 0 · Accepted Answer

ボタンをクリックすると、入力が非表示になり、テキストがスパンにコピーされ、スパンが表示されます。

$("#btn").click(function(){
   $("#changedText").html($("#text").val());
   $("#text").hide();
});

score 0 · Accepted Answer

あなたはこれを行うことができます -

$('#btn').on('click',function(){
   $('#text').replaceWith("<span id='changedText'>"+$('#text').val()+"</span>");
});

3 に答える 3