Question

我正在构建一个允许编辑文件的小文本编辑器，并允许创建新文件。这就是我的选择菜单的配置方式。

<select name="reportname" id="reportname" class="form-control">
    <option value="zrxqy">--Choose a Report--</option>
    <option value="newReport">--Create a New Report--</option>
    <optgroup label="General Reports">
        <option name="Volumes" id="Volumes" value="volumes.php">Volumes</option>
        <option name="Options" id="Options" value="Options.php">Options</option>
    </optgroup>
</select>

此下方有<textarea>，显示所选报告文件的内容。 id="reporttxt"。当select被更改时，我希望清除textarea的内容，然后放入新的文件内容。这在文件之间切换时有效，但如果用户输入文本，则会中断清除。

我试过这个：

$("#reportname").change(function(){
    $("reporttxt").html('') //this works when switching between functions
    //function to import new text <-- this works fine
}

我也试过这个：

$("#reportname").change(function(){
    if($(this).val() == "newReport"){
        $("#reporttxt").val(''); //this clears user input but now nothing will display
    } else {
        $("#reporttxt").html('');
    }
    //function to import text <-- does not display text after .val('') is fired
});

函数导入文本将其插入如下：

$.ajax({
    type: "GET",
    url: "report-data.php",
    data: "file="+$(this).val(),
    datatype: "json",
    success: function( result ) {
        $("#reporttxt").append(result.body);
    }
});

为什么会发生这些奇怪的事情？

修改

问题实际上是.append()。

我不确定为什么要改变

$("#reporttxt").append(result.body);

到

$("#reporttxt").val(result.body);

修复了问题。我现在只是使用$("#reporttxt").val('');清除。

Answer 1

jQuery的ajax功能没有像您在此处使用的date设置：date: "file="+$(this).val(),。我认为你的意思是data或者我错了吗？

Answer 2

发布回答...... 调用val（）以在更改函数中设置文本区域上的文本。这是为了解答为什么append（）不起作用。 append（）只是将另一个节点添加到HTML DOM中的调用者节点。

jQuery - 在选择更改时清除textarea

2 个答案: