0

問題: 多くの<input>フィールドを含むページがあります (すべてがテキスト フィールドであるとだけ言ってください) ボタンをクリックすると、すべての入力フィールドがプレーンテキストのみになります。たとえば<input type="text" value="123" />、123 になり、別のボタンをクリックすると、テキストが元に戻ります。たとえば、123 になります。<input type="text" value="123" />

<input>JavaScript と jquery を使用して、すべての を自動的にスキャンし、それらを一度に変更する方法はありますか。

ありがとうございました！

編集済み あなたたちは間違った考えを持っているようです。私が書いたことをもう一度読んでください：例えば<input type="text" value="123" />、123になる

私は既に value="123" を持っています。なぜ再度値を設定する必要があるのでしょうか?

私が欲しいのは例えば

<body><input type="text" value="123" /><input type="text" value="456" /></body>になり<body>123456</body>、後で<body>123456</body>戻る<body><input type="text" value="123" /><input type="text" value="456" /></body>

4

4 に答える 4

2

これを使って一方通行、

$('input').replaceWith(function(){
    return $('<div />').text(this.value).addClass('plain-text');
});​​​

そしてこれはもう一方に行きます。

$('.plain-text').replaceWith(function(){
    return $('<input />').val($(this).text());
});

</p>

于 2012-10-04T04:27:31.750 に答える
2

このリンクを確認してくださいhttp://jsfiddle.net/Evmkf/2/

HTML:

<div id='divInput'>
    <input type="text" value='123' />
    <br/>
    <input type="text" value='456' />
    <br/>
    <input type="text" value='789' />
</div>
<div id='plainText' style='display:none'></div>
<div>
    <input type="button" id='btnPlain' value='Make It Plain' />
    <input type="button" id='btnInput' value='Make It Text' />
</div>​

Javascript:

$("#btnPlain").bind('click',function(){
  $("#plainText").html('');
  $("#divInput input[type=text]").each(function(index){
    $("#plainText").append('<span>'+$(this).val()+'</span>');
    $("#divInput").hide();
    $("#plainText").show();
  });
});

$("#btnInput").bind('click',function(){
  $("#divInput").html('');
  $("#plainText span").each(function(index){
    $("#divInput").append('<input type="text" value="'+$(this).text()+'"/><br/>');
    $("#plainText").hide();
    $("#divInput").show();
  });
});

</p>

于 2012-10-04T05:34:36.487 に答える
1

このフィドルを試してみてください

$(function() {
    var arr = [];
    $('#btn').on('click', function() {
        var $text = $('#inp input[type="text"]');
        if( $text.length > 0){
            $text.each(function(i) {
                arr[i] = this.value;
            });
            $('#inp').html(arr.join());
        }
        else{
            if(arr.length <= 0){
            }
            else{ // Add Inputs here
                var html = '';
                $.each(arr, function(i){
                    html += '<input type="text" value="' + arr[i]+ '"/>'
                });
                 $('#inp').html(html); 
            }
        }
    });
});

</ p>

于 2012-10-04T04:53:09.627 に答える
-1

入力ごとに非表示の要素を作成し、jquery を使用して入力を非表示にし、非表示の要素を表示して入力値を与える必要があります。

<input type="text" value="123" id="input_1" />
<div id="div_1" style="display:none;"></div>

$("#div_1").html($("input_1").val());
$("#input_1").hide();
$("#div_1").show();
于 2012-10-04T04:28:38.623 に答える