0 
<script>
var itemsAdded = Array();

function moveNumbers(text) { 
var i = itemsAdded.indexOf(text)
if ( i >= 0) { 
itemsAdded.splice(i,1);
} else {
itemsAdded.push(text);
}
document.getElementById("result1").value=itemsAdded.join(" ");

if ( i >= 0) {  

} else{
itemsAdded.push(text);
}
document.getElementById("result2").value=itemsAdded.join(" "); 
}

$(function() {
for (i=0;i<10;i++) {
console.log(i);
$("body").append("<input type='checkbox' name='add' value='" + i + "' 
  onclick='moveNumbers(this.value)'/> Checkbox" + i + "<br/>");
 }
});

</script>


<table width="95%" height="24" border="1" align="center">
<tr>
<th><h2>Selected Image 5x7</h2></th>
<tr>
<td>
<textarea rows="4" cols="70" name="add" id="result1" style="background:#B0D2D7;
width:100%;overflow:auto;resize:none"
readonly></textarea>
</td>
</tr>
<tr><tr>
<th><h2>Selected Image 6x8</h2></th>
<tr>
<td>
<textarea rows="4" cols="70" name="add" id="result2" style="background:#B0D2D7;
width:100%;overflow:auto;resize:none"
readonly></textarea>
</td></tr>
</table>

こんにちは、初心者ですので、乱雑でしたら申し訳ありません。

私はこれを機能させていますが、ボックスをチェックすると値がテキスト領域に表示されますが、テキスト自体はいたるところにあります。テキスト領域からテキストを削除するためにチェックを外した場合は、チェックボックスも必要です。どんなアイデアも素晴らしいでしょう！これが理にかなっていることを願っています...

乾杯。

4

3 に答える 3

3

あなたが説明するほど面倒である必要はありません。また、現在の状態では html の構造が明らかに壊れているため、どのように機能しているのかわかりません。

以下は、少し更新されたコードです。これは、スニペットで達成しようとしているものと同等だと思います。デモ

JS:

var itemsAdded = Array();

function moveNumbers() {
    var text = this.value;
    var i = itemsAdded.indexOf(text)
    if (i >= 0) itemsAdded.splice(i, 1);
    else itemsAdded.push(text);
    document.getElementById("result1").value = itemsAdded.join(" ");

    if (i < 0) itemsAdded.push(text);
    document.getElementById("result2").value = itemsAdded.join(" ");
}

$(function () {
    for (i = 0; i < 10; i++)
    $("<div>Checkbox" + i + "</div>").appendTo(document.body)
        .prepend($("<input type='checkbox' name='add'/>")
        .val(i).click(moveNumbers));
});

HTML:

<table width="95%" height="24" border="1" align="center">
    <tr>
      <th>
         <h2>Selected Image 5x7</h2>
      </th>
    </tr>
    <tr>
      <td>
         <textarea rows="4" cols="70" name="add" id="result1" readonly></textarea>
      </td>
    </tr>
    <tr>
      <th>
         <h2>Selected Image 6x8</h2>
      </th>
    </tr>
    <tr>
      <td>
         <textarea rows="4" cols="70" name="add" id="result2" readonly></textarea>
      </td>
    </tr>
</table>

CSS:

textarea {
    background:#B0D2D7;
    width:100%;
    overflow:auto;
    resize:none
}
于 2013-09-04T03:58:16.287 に答える
0

クリックイベントを正しく添付していません。彼らは解雇さえしません。以下の例を参照してください。チェックボックスが追加されたら、クリック イベントを添付します。this以下に示すよう に、要素の値を取得できます。JSフィドル

var itemsAdded = Array();

function moveNumbers() {
    var i = itemsAdded.indexOf(this.value)
    if (i >= 0) {
        itemsAdded.splice(i, 1);
    } else {
        itemsAdded.push(this.value);
    }
    document.getElementById("result1").value = itemsAdded.join(" ");

    if (i < 0) {
        itemsAdded.push(this.value);
    }
    document.getElementById("result2").value = itemsAdded.join(" ");
}

$(function () {
    for (i = 0; i < 10; i++) {
        console.log(i);
        $("body").append("<input type='checkbox' name='add' value='" + i + "'/> Checkbox" + i + "<br/>");
    }

    $("input:checkbox").click(moveNumbers);
});
于 2013-09-04T04:03:08.327 に答える
0

これを試してくださいhttp://jsfiddle.net/KCmbm/2/

注: [b] のような特別なタグを使用しない場合: コメント付きのコードを使用します (ただし、提供されたテキストのすべての出現を置き換えます)。

JavaScript

var itemsAdded = Array();

function moveNumbers(text) {
    console.log(text);
    var addedText = '[b' + text + ']' + text + '[/b]';
    $('#result1').val($('#result1').val() + addedText);
    //$('#result1').val($('#result1').val() + text);

    console.log(addedText);
}

function removeText(text){
    //$('#result1').val($('#result1').val().replace(new RegExp(text, 'g'), ''));
    $('#result1').val($('#result1').val().replace('[b' + text + ']' + text + '[/b]', ''));
}

$(document).ready(function(){
    $('.chkAdd').on('change', function(){
        $(this).prop('checked') ? moveNumbers($(this).val()) : removeText($(this).val());
    });
})
于 2013-09-04T04:17:24.590 に答える