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

试试这个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 回答
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 回答