问题1

Question

我有几个关于表单和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");

我只是试图将此作为一种学习方法，并且非常感谢三个问题的任何指导或答案。非常感谢你的帮助！

Answer 1

问题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（）函数

Answer 2

回答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：在源textarea中添加一个onkeydown事件来执行翻译（或者需要做什么），然后将结果放入结果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：也许onsubmit元素中的form事件会清理文本区域的输入。看看JavaScript的encodeURIComponent。也许这对你有用：

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

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

2 个答案:

问题1

问题2

问题3