使用 Javascript 设置文本输入值答案

【问题标题】：settin up a text input value with Javascript使用 Javascript 设置文本输入值
【发布时间】：2014-10-17 20:20:28
【问题描述】：

我正在创建一个计分选票来为提交的比赛视频打分。我对所有视频都使用相同的 HTML 表单来评分。使用 java 脚本动态更新的唯一字段是：裁判姓名和参赛者姓名。我的问题是我使用 java 脚本设置的值显示在表单本身上，但没有记录在 csv 文件中。

这是我的 HTML：选择你的名字法官#1 法官#2 法官#3 法官#4 法官#5 法官#6 基于此选项，他们将获得一组尚未完成评分的视频，并显示第一个嵌入视频的评分表。最初它们隐藏在页面上。

    <form id="ballot1" action="javascript: sendBallot()" method="post" enctype="multipart/form-data"> 
    <table border="0" style="border-collapse: collapse" width="100%" id="table3">
     <tr> 
       <td><input type="hidden" name="Contestant" value="Contestant1"></td>
       <td width="78%"><input name="form_judge" id="form_judge" value=""></td>
     </tr>
     <tr>
       <td><p><span style="font-size:1em;"><strong>1. Efficacy of Practice - 50%</strong></span></p></td>
    </tr>
    <tr>
    <td><label class="ballot">&nbsp;&nbsp;&nbsp;a. Video explores relevant subject matter  </label>
    </td>
    <td>
       <select class="ballot" id="one_a_score" name="one_a_score" valign="bottom">
         <option value="0" selected>Select Score</option>
         <option value="2">Poor</option>
         <option value="4">Below average</option>
         <option value="6">Average</option>
         <option value="8">Good</option>
         <option value="10">Excellent</option>
       </select>
   </td>
   </tr>
   </table>
   <div class="buttons">
     <input type="submit" name="submit" value="Submit Form" id="submit"/> 
     <input type="reset" value="Reset" id="resetBtn"/>
   </div>

我的 java 脚本来设置表单值：

function showBallotForm(divName) {
    var divName = 'Contestant1';
    document.getElementById(divName).style.display='';
    var selectjudgeName = document.getElementById("judgeName");
    oFormObject = document.forms['ballot1'];
    oFormElement = oFormObject.elements['form_judge'];
    oFormElement.value = selectjudgeName.options[selectjudgeName.selectedIndex].value;
   }

var divName = 'Contestant1'; - 一旦我弄清楚为什么设置裁判姓名并在表格上显示没有问题，这将被删除，但是当我输入所有分数并点击“提交”按钮时，整个表格都记录在 csv 文件中，除了一个动态设置的值（form_judge）。顺便说一句，我尝试使用 oFormElement 的 getElementById insted，结果是一样的。我可以在表格上看到它，但它在 csv 文件中只记录了“法官”一词，而不是实际名称。我错过了什么？非常感谢您的帮助。

【问题讨论】：

标签： javascript html forms submit

【解决方案1】：

我不太明白你的 javascript 做了什么，因为其中有几个错误：

function showBallotForm(divName) {
    var divName = 'Contestant1';

divName 参数从未使用过，因为它是立即重写的？

document.getElementById(divName).style.display='';

不知道你想要什么，你想显示隐藏的输入吗？

var selectjudgeName = document.getElementById("judgeName");

你的 HTML 中没有带有“judgeName”id 的元素，所以这不起作用，我假设你没有粘贴完整的代码

oFormObject = document.forms['ballot1'];
oFormElement = oFormObject.elements['form_judge'];

好的，但是您可以通过简单地使用 document.getElementByid("form_judge") 来做到这一点

oFormElement.value = selectjudgeName.options[selectjudgeName.selectedIndex].value;

但这是你的错误。您不能在选择上设置值。我看到该对象是一个输入，但这很奇怪，因为我什至看不到 selectJudgeName 来自哪里！在表单上发送的数据是 selectedIndex，而不是值。所以你想要的是找到你想要的选项并指向它，如下所示：

oFormElement.selectedIndex = (the index of the option you want)

如果您不知道索引，则必须在 oFormElementobject 上查找它，只需执行 for 循环搜索哪个选项具有您想要的值，当您找到它时，将其设置为 selectedIndex然后爆发。

另外，提交这是您在操作中命名的 javascript，您确定发送的是正确的数据吗？

【讨论】：