在javascript中单击按钮时更改文本区域中的文本的方法是什么 - What are those ways to change text in textarea when button on click in javascript?

例如，现在我有：

<textarea style='width:100%;height:300px' id='default_file' readonly="readonly">
{$defaultFileContents[0]|escape}  // smarty code  
</textarea>

但是，我希望它显示等效的内容（例如，单击"下一步"按钮时）：

<textarea style='width:100%;height:300px' id='default_file' readonly="readonly">
{$defaultFileContents[1]|escape}  // smarty code
</textarea>

以及索引 2、3、4 等。

$defaultFileContents是从 PHP 脚本中检索的字符串数组。

编辑：

{literal}
<script language="javascript" type="text/javascript" src="modules/Yastt/views/tpls/editarea/edit_area/edit_area_full.js"></script>
<script language="javascript" type="text/javascript">
editAreaLoader.init({
    id : "default_file"     // textarea id
    ,syntax: "{/literal}{$fileType}{literal}"           // syntax to be uses for highgliting
    ,start_highlight: true      // to display with highlight mode on start-up
    ,allow_toggle: true
    ,is_editable:false
});
editAreaLoader.init({
    id : "translated_file"      // textarea id
    ,syntax: "{/literal}{$fileType}{literal}"           // syntax to be uses for highgliting
    ,start_highlight: true      // to display with highlight mode on start-up
    ,allow_toggle: true
});

{/literal}
</script>
<table><tr><td colspan='2'>
    <div style='font-size:18px;font-weight:bold;'>File Edit ({$defaultLang} To {$translatedLang})
    </div>
</td></tr>
<tr><td>
<div style='font-size:18px;font-weight:bold;'>{$file}</div>
</td></tr></table>

<textarea style='width:100%;height:300px' id='default_file'>
{$defaultFileContents[0]|escape}
</textarea>

<form method='POST' name='FileEdit' action='index.php'>
<input type='hidden' name='module' value='Yastt'>
<input type='hidden' name='action' value='saveraw'>
<input type='hidden' name='lang' value='{$translatedLang}'>
<input type='hidden' name='file' value='{$file}'>
<input type='submit' value='Save'>
<input type='button' value='Cancel' onclick='document.location.href="index.php?module=Yastt&action=overview&lang={$translatedLang}"'>
<input type='button' value='Copy From Above' onclick='document.getElementById("translated_file").value = decodeURIComponent("{$defaultFileContents[0]|escape:'url'}");'>
<textarea style='width:100%;height:500px' name='rawfile' id='translated_file'>
{$translatedFileContents|escape}
</textarea>
</form>
<br>
</form>

您将如何修改此 tpl 代码？

您需要将消息数组转换为 JavaScript 数组。您可以使用json_encode使它变得轻而易举：

$message = array( "Message 1", "Message 2", "Message 3" );
// var messages = ["Message 1","Message 2","Message 3"];
printf("var messages = %s;", json_encode( $message ));

接下来，您准备 HTML：

<textarea id="default_file"></textarea><br/>
<button id="advance_text" onclick="advanceMessage()">Next</button>

通常，您会从 JavaScript 方面进行点击绑定，但现在我将保持原样：

// Reference to our textarea, build messages array, set message counter:
var textarea = document.getElementById("default_file");
var messages = [ "First Message", "Second Message", "Third Message" ];
var currMesg = 0;
// Advance to the next message
function advanceMessage() {
    textarea.value = messages[ currMesg++ % messages.length ];
}
// Call immediately to load first message
advanceMessage();

小提琴：http://jsfiddle.net/hCMs8/

我会做这样的事情：

我以前没有使用过 smarty，所以做你需要做的任何事情，将你想要的文本从 smarty 变成一个数组。

var text_from_smarty = [ "{$defaultFileContents[0]|escape}", "{$defaultFileContents[1]|escape}"]; // etc
var visible_text_index = 0;

现在，当您点击下一步时，调用如下函数：

function show_next_text(){
    document.getElementById('default_file').innerHTML = text_from_smarty[ (visible_text_index++)%text_from_smarty.length ];
}

这是一个jsfiddle：http://jsfiddle.net/6dmFY/