选择onChange事件触发器填充隐藏输入值从一个数组的价值

我已经做了大量的网络研究来到这个代码失败:(我有一个选择列表，有一个onchange事件“电子邮件（）当我选择一个特定的索引值时，我有一个javascript拉数组的值来填充“收件人”的INPUT值，我知道一点javascript，但是显然不够用，任何帮助都会很棒，在此先感谢，我道歉如果这个职位是不是“论坛正确的”这是我第一个现在:)选择onChange事件触发器填充隐藏输入值从一个数组的价值

<html> 
<head> 
<script type="text/javascript"> 
function emails() { 
var valObj = document.getElementsByName("recipient").value; 
var selOpts = document.getElementsById("Concerning"); 
var selIndex = selOpts.selectedIndex; 
var recValue = selOpts.options[selIndex].value; 

var jvalObj = new Array() 
jvalObj[0]="Empty"; 
jvalObj[1]="email#1"; 
jvalObj[2]="email#2"; 
jvalObj[3]="email#3"; 
jvalObj[4]="email#4"; 
jvalObj[5]="email#5"; 
jvalObj[6]="email#6"; 
jvalObj[7]="email#7"; 
jvalObj[8]="email#8"; 
jvalObj[9]="email#9"; 

    for(i=0; i<selOpts.options.length; i++;)    
     if (recValue.value=="Benefits") 
      {valObj.value = jvalObj[1].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[2].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[2].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[3].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[4].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[5].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[6].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[7].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[8].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[3].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[2].value; break;} 

     if (selOpts.options[i].selected==true) 
      {valObj.value = jvalObj[9].value; break;} 
     }  
}</script> 
</head> 
<body> 

<form action="/cgi-bin/formmail" method="post" > 
    <td width=255 valign=top style='width:191.25pt;padding:0pt 0pt 0pt 0pt'> 
    <select onChange="javascript:emails();" 
" id="Concerning"> 
        <option value=""> 
      <option value="Benefits">Benefits 
      <option value="Customer_Service">Customer Service 
      <option value="Employee_Paperwork">Employee Paperwork 
      <option value="Human_Resources"> Human Resources 
      <option value="Open_Positions">Open Positions 
      <option value="Payroll">Payroll 
      <option value="Quote_Request">Quote Request 
      <option value="Safety">Safety 
      <option value="Technical_Support">Technical Support 
      <option value="Training">Training 
      <option value="Unemployment">Unemployment 
      <option value="Workers_Compensation">Workers' Compensation 
    </select> 
    </td> 

    <input TYPE="hidden" NAME="recipient" VALUE=""> 
    <input TYPE="hidden" NAME="subject" VALUE="Contact Form"> 
    <input TYPE="hidden" NAME="email" VALUE="[email protected]"> 
    <input TYPE="hidden" NAME="required" VALUE="Name,Phone,Email,Concerning,Comments"> 


    </form></body> 
</html>

来源

2012-01-31 SimpleHelp

认为你有一个切正粘贴错误。 document.getElementsById应该是document.getElementById，因为它只获取一个元素。 – scrappedcola 2012-01-31 21:45:02

你也onChange应该只是onChange =“emails（）;”不需要添加“javascript：” – scrappedcola 2012-01-31 21:45:57

，我终于明白了，这应该做的伎俩。

document.getElementById('Concerning').onchange = function() { 
    var myArray = ["Empty", 
        "email#1", 
        "email#2", 
        "email#3", 
        "email#4", 
        "email#5", 
        "email#6", 
        "email#7", 
        "email#8", 
        "email#9"]; 

    document.getElementsByName('recipient')[0].value = myArray[this.selectedIndex]; 
};

虽然，因为它是短了很多，我可能做这样的事情，而不是：

document.getElementsByName('recipient')[0].value = 'email#' + this.selectedIndex;

我认为这是简单的一大堆比你做它。如果我正确地解释你的代码，你所要做的就是取出列表中的选定值并将其粘贴到隐藏的输入recipient。在这种情况下，您可以将this传递给onChange声明。新的选定值将是该列表的值。最后，获取隐藏的输入并在那里设置值。

http://jsfiddle.net/pvvQd/

<select onChange="emails(this);" id="Concerning">

在该代码中的函数emails接受一个参数。我们将this传递给该选择列表的参数。您在原始代码中错误地使用了getElementsByName。这将返回具有该名称的元素数组（因为每个页面的名称不唯一）。所以假设只有一个我们检索零指数。你应该给该字段一个id，然后通过它来检索它。最后，我们将隐藏的字段值设置为选择列表的值。

function emails(elem) { 
    //you should probably give this an id and retrieve using that instead 
    var recipients = document.getElementsByName('recipient')[0]; 
    recipients.value = elem.value; 
}

其实，如果你想使这个超级短线，你可以这样做：

http://jsfiddle.net/pvvQd/1/

我会鼓励你远离内嵌的JavaScript声明了。相反，你可以做这样的事情。这样你的代码和html就不会交织在一起了。

http://jsfiddle.net/pvvQd/2/

document.getElementById('Concerning').onchange = function() { 
    document.getElementsByName('recipient')[0].value = this.value; 
};

来源

2012-01-31 21:53:06 mrtsherman

感谢您的回复，但不是我要找的。根据从“选择”列表中选择的内容，我将从数组中拉取相关电子邮件（jvalObj）以填充隐藏的“收件人”字段。我知道javascript可以放在onchange中，但我宁愿没有电子邮件作为选择值。 – SimpleHelp 2012-01-31 21:59:59

@ user1181400 - 啊，我现在看到了。对不起，我错过了。看到这个 - http://jsfiddle.net/pvvQd/3/ – mrtsherman 2012-01-31 22:11:24

第一个是我想要的，我可以将数组中的值数量与选择列表匹配。所以我会有一些电子邮件地址的倍数。一旦我把实际的电子邮件地址，它不会工作。如[email protected]。它在您提供给我的网站中的数组中删除了引号。 – SimpleHelp 2012-01-31 22:42:30

我认为你有一个切正粘贴错误。 document.getElementsById应该是document.getElementById，因为它只抓取一个元素。

还有一个错误与一个额外的"<select onChange="javascript:emails();" " id="Concerning">应该<select onChange="javascript:emails();" id="Concerning">

你也onChange应该只是onChange="emails();"不需要添加"javascript:"

尝试改变输入有一个ID值不只是名字这样而不是使用文档。getElementsByName（返回一个数组，为什么，因为它应该是valObj[0].value =您valObj.value分配失败），可以使用document.getElementById("recipient")

您还检查的recValue这里if (recValue.value=="Benefits") 值时，该变量已经值应该是recValue == "Benefits"。

您不需要浏览所有元素，因为您已经拥有选定的索引，并且可以仅使用该单个值。循环只是矫枉过正。不确定你想在那里实现什么。

来源

2012-01-31 21:58:39 scrappedcola

mrtsherman将其简化为一个数组和两行代码对我来说:)是的，它看起来有点过度杀死，或多或少是一种合作我发现的想法。感谢煽动！ – SimpleHelp 2012-02-01 15:05:19

对原始源代码的修改建议，请参阅评论以供修改。

function emails() 
{ 
    var valObj = document.getElementsByName("recipient").value; 
    var selOpts = document.getElementsById("Concerning"); 
    var selIndex = selOpts.selectedIndex; 
    var recValue = selOpts.options[selIndex].value; 

    /*Since the array will assing default integer indices where keys don't exist 
     we can rewrite the array as follows to spare redundant write access to it*/ 
    var jvalObj = new Array("Empty", "email#1", "email#2", "email#3", "email#4", 
          "email#5", "email#6", "email#7", "email#8", "email#9"); 

    for(i=0; i<selOpts.options.length; i++){       
      if (recValue.value=="Benefits"){ 
        valObj.value = jvalObj[1].value; 
        i = selOpts.options.length; 

      /*Each of the deleted conditionals used the same comparison which means 
       that they will never meet their criteria without first meeting this 
       conditional, which was set to break the loop*/ 
      }else if (selOpts.options[i].selected==true){ 
        valObj.value = jvalObj[i].value; 

        /*Personal preference: unless you're bound to the use of break I'd leave use i = len 
         - the exception being where you'd want to retain i of course 
        */ 
        i = selOpts.options.length; 
      } 
    }

的HTML

<!-- DOM events carry out javascript callbacks by default --> 
<select onChange="emails();" id="Concerning">

来源

2012-01-31 22:04:43 CBusBus

<!DOCTYPE html> 
<html lang="eng"> 
<head> 
<script type="text/javascript"> 
function emails() 
{ 
    var recipient = document.getElementById("recipient"); 
    var concerning = document.getElementById("Concerning"); 

    var recipientEmailToSet = concerning.options[concerning.selectedIndex].value; 

    recipient.value = recipientEmailToSet; 

    //Remove next line for alert to go away 
    alert(recipient.value); 
} 
</script> 
</head> 
<body> 

<form action="/cgi-bin/formmail" method="post" > 
    <td width=255 valign=top style='width:191.25pt;padding:0pt 0pt 0pt 0pt'> 
     <select onChange="emails();" id="Concerning"> 
      <option value=""></option> 
      <option value="email#1">Benefits</option> 
      <option value="email#2">Customer Service</option> 
      <option value="email#3">Employee Paperwork</option> 
      <option value="email#4"> Human Resources</option> 
      <option value="email#5">Open Positions</option> 
      <option value="email#6">Payroll</option> 
      <option value="email#7">Quote Request</option> 
      <option value="email#8">Safety</option> 
      <option value="email#9">Technical Support</option> 
      <option value="email#10">Training</option> 
      <option value="email#11">Unemployment</option> 
      <option value="email#12">Workers' Compensation</option> 
     </select> 
    </td> 

    <input TYPE="hidden" id="recipient" VALUE="" /> 
    <input TYPE="hidden" id="subject" VALUE="Contact Form" /> 
    <input TYPE="hidden" id="email" VALUE="[email protected]" /> 
    <input TYPE="hidden" id="required" VALUE="Name,Phone,Email,Concerning,Comments" /> 


    </form> 
</body> 
</html>

来源

2012-01-31 22:14:07 Shurgu

选择onChange事件触发器填充隐藏输入值从一个数组的价值

回答

相关问题