我有几个关于表单和PHP的问题，但是如果我应该把它们放到不同的帖子中，那么我会。关于表单和php的问题（清除表单，实时刷新，多行）

这里是我的表单代码：

<form id="t-form" name="tForm" action="translate.php" method="POST"> 
      <div id="t-bar"> 
       <div class="t-select"> 
        <select name="start-lang" id="choice-button"> 
         <option value="english">English</option> 
        </select> 
        <label>into</label> 
        <select name="end-lang" id="choice-button" onChange="document.forms['tForm'].submit();"> 
         <option value="caps"<?php if ($resLang == 'caps') echo ' selected="selected"'; ?>>CAPS</option> 
         <option value="lowercase"<?php if ($resLang == 'lowercase') echo ' selected="selected"'; ?>>lowercase</option> 
        </select> 
        <input type="submit" id="t-submit" value="Translate"> 
       </div> 
      </div> 
      <div id="t-main"> 
         <textarea id="txt-source" name="t-src" autofocus="autofocus" placeholder="Type in what you would like to convert…" onChange="document.forms['tForm'].submit();"><?php echo $source; ?></textarea> 
         <input type="button" id="t-clear" onclick="this.form.elements['t-src'].value=''"> 

         <textarea id="txt-result" name="txt-result" readonly disabled="disabled" placeholder="result..."><?php echo $result; ?></textarea> 
         <input type="button" id="t-copy" name="t-copy"> 
      </div> 
     </form>

问题1：我现在有onclick="this.form.elements['t-src'].value=''"按下按钮时清除一个文本框。是否有可能具有相同的属性清除我的表单中的两个textareas？我似乎无法找到任何地方用1个按钮清除2个元素的答案。我不想清除表单，因为我想保留选定的下拉值，这就是为什么我这样做。

问题2：我该如何去实现结果textarea的实时刷新，以便用户可以简单地键入并查看结果？我已经看过所需的ajax和jquery，并且很困惑，因为大多数不会显示如何输出到表单元素，只输出到div。（类似于Google的翻译）

问题3：我意识到，如果用户确实在textarea的新行，当他们提交翻译，这让他们有一个PHP头错误。任何想法如何我可以避免这一点？这是我在表单中使用的translate.php文件头：

header("location: /?txt-result=$result&t-src=$textSource&end-lang=$outputLang");

我只是想做到这一点作为一个学习excersise，真的希望任何指导或回答的三个问题。非常感谢您的帮助！

来源

2012-01-30 MCG

对于第三个问题，你将不得不为每个变量使用urlencode（$ var）。其他两个更复杂。并在第一个，你写“我目前有......清除一个文本框”，一些文字在那里失踪？ – 2012-01-30 14:49:53

感谢urlencode提示，工作就像一个魅力！关于问题1，我继续解决这个问题，谢谢！ – MCG 2012-01-30 15:07:19

你想如何识别你想清除的文本框？他们应该有一类他们的owm？或者你知道他们的ID？ – 2012-01-30 15:09:23

答1：让你的onclick事件调用它清除那些值，你的函数：

<script type="text/JavaScript"> 
    function clearTextareas() 
    { 
     this.form.elements["t-src"].value = ""; 
     this.form.elements["txt-result"].value = ""; 
    } 
</script> 

<input type="button" id="t-clear" onclick="clearTextareas()">

答案2 ：在源文本区域中添加一个onkeydown事件，该事件执行翻译（或任何需要执行的操作），然后将结果放入r esult textarea的：

<script type="text/JavaScript"> 
    function translateText() 
    { 
     var text = this.form.elements["t-src"].value; 
     // do something 
     this.form.elements["txt-result"].value = text; 
    } 
</script> 

<textarea id="txt-source" name="t-src" autofocus="autofocus" placeholder="Type in what you would like to convert…" onkeydown="translateText()"><?php echo $source; ?></textarea>

答3：或许在form元素的onsubmit事件，将消毒从文本区输入。看看JavaScript的encodeURIComponent。也许这会适合你：

<script type="text/JavaScript"> 
    function sanitize() 
    { 
     this.form.elements["t-src"].value = encodeURIComponent(this.form.elements["t-src"].value); 
    } 
</script>

来源

2012-01-30 15:22:54 Travesty3

非常感谢您的支持！答案1就像一个魅力。我没有考虑做一个功能，包括两个电话，所以我会牢记这一点！ ///答案2有效，但会导致刷新。我会更多地关注Ajax，所以我不必刷新页面。 ///答案3我从来没有听说过，所以我会去阅读。 ///再次感谢您花时间回答！ – MCG 2012-01-30 15:59:51

我为答案2发布的代码不应该导致刷新。如果您用于执行翻译的代码位于某个外部服务器端脚本（我假设为PHP）中，那么是的，您将需要使用AJAX调用脚本而不刷新，但是您可以在该位置进行AJAX调用它在哪里说'//做点什么'。肯定会研究AJAX，因为您在将来的工作中无疑需要它。我甚至会建议使用库或甚至编写自己的代码，以减少进行AJAX调用所需的大量代码。 – Travesty3 2012-01-30 16:05:44

问题1

你应该有：

onclick="clearTextboxes();"

，并在JavaScript是这样的：

//if you want to delete all the inputs that are of type text 
function clearTextboxes(){ 
    var inputs = document.getElementById('t-form').getElementsByTagName('input'); 
    for (var control in inputs){ 
     if(inputs[control].getAttribute('type') == 'text'){ 
     inputs[control].value = ''; 
     } 
    } 
}

问题2

它过于宽泛，把这里作为答案，你应该真的看jQuery的$ .ajax，并创建一个具体的不同的问题疑惑。

问题3

使用PHP进行urlencode（）函数

来源

2012-01-30 15:14:45

关于表单和php的问题（清除表单，实时刷新，多行）

回答

问题1

问题2

问题3

相关问题