2

私はlistBoxを持っています。それを選択すると、textAreaに出力され、その横にクリアボタンが表示されます。したがって、textAreaの値をクリックすると、正常に動作します。問題は次のとおりです。 、textAreaの値をクリアした後、listBoxを選択すると、値がtextAreaに出力されません。何が問題なのでしょう？これがコードです、

HTML：

<select id="aggregationFunct" name="aggregationFunct" size="3" multiple="multiple">
<option value="Count">Count</option>
<option value="Sum">Sum</option>
<option value="Avg">Avg</option>
</select>

<input type="button" id="addToExp1Id" value="Add" onclick="addToExpText()" >
</br> </br>
<label for="expTextId" style="font-family: sans-serif; font-size: small;"> Expression    : </label>        
<textarea name="textArea" id="expTextId" readonly="readonly"> </textarea>
<input type="button" id="clearId" value="Clear" onclick="clearTextArea()">

JavaScript：

function addToExpText() {
alert("hello);
var aggreFunct = document.getElementById("aggregationFunct").value;

var obj = document.getElementById("expTextId");
var aggFun = document.createTextNode(aggreFunct);
obj.appendChild(aggFun);
obj.appendChild(openP);
}

function clearTextArea(){
 document.form1.textArea.value='';

}

textAreaの値をクリアした後、もう一度listBox値をクリックして追加しても、追加されません。plsの助け...これは正しく機能していない実装です。これは私が初めて使用しているためであり、間違っている可能性があります。

http://jsfiddle.net/8dHf5/5/

4

2 に答える 2

2

なぜそのように機能するのかはわかりませんが、いくつかの可能な修正があります: append を使用する (新しい集計関数を追加する) 代わりに、値を使用して追加と消去の両方を行うことができます:

function addToExpText() {
    alert("hello");
    var aggreFunct = document.getElementById("aggregationFunct").value;
    var obj = document.getElementById("expTextId").value += aggreFunct;    
}

function clearTextArea(){
            document.getElementById("expTextId").value='';              
}

デモ: http://jsfiddle.net/8dHf5/17/

または、子ノードの削除を使用して、テキストエリアの値をクリアできます。

function addToExpText() {
    alert("hello");
    var aggreFunct = document.getElementById("aggregationFunct").value;
     var obj = document.getElementById("expTextId");
     var aggFun = document.createTextNode(aggreFunct);
     obj.appendChild(aggFun);    
}

function clearTextArea(){
            var myNode = document.getElementById("expTextId");
            while (myNode.firstChild) {
                myNode.removeChild(myNode.firstChild);
            }

     }
​

デモ: http://jsfiddle.net/8dHf5/14/

また、obj.appendChild(openP);あなたのコードには行がありますが、コードで使用できるように見えないので、削除しました。

別の瞬間:clearTextAreaあなたのテキストエリアにアクセスしようとしていますdocument.textArea-何かが欠けていなければ、それはIEのみの機能であり、名前ではなくIDで動作します. クロスブラウザである document.getElementById を使用することをお勧めします。

于 2012-12-26T10:07:11.130 に答える
0

コードに誤りがありました。私はそれを変更しました...

これで、データを消去できます。以下のコードを参照してください。

<html>
<body>
<script>
function addToExpText() {
alert("hello");
var aggreFunct = document.getElementById("aggregationFunct").value;

var obj = document.getElementById("expTextId");
var aggFun = document.createTextNode(aggreFunct);
obj.appendChild(aggFun);

}

function clearTextArea(){
var textArea = document.getElementById("expTextId");
 while (textArea.firstChild) {
            textArea.removeChild(textArea.firstChild);
        }

} 
</script>
<select id="aggregationFunct" name="aggregationFunct" size="3" multiple="multiple">
<option value="Count">Count</option>
<option value="Sum">Sum</option>
<option value="Avg">Avg</option>
</select>

<input type="button" id="addToExp1Id" value="Add" onclick="addToExpText()" >
</br> </br>
<label for="expTextId" style="font-family: sans-serif; font-size: small;"> Expression    : </label>        
<textarea name="textArea" id="expTextId" readonly="readonly"> </textarea>
<input type="button" id="clearId" value="Clear" onclick="clearTextArea()">

</body>
</html>
于 2012-12-26T10:04:49.197 に答える