提取窗体的值"select"并在窗体的"action"中使用它

我正在尝试使用下拉框来选择要发送到的电子邮件的正确第一部分。

<html>
<head>
  <script language="JavaScript">
    <!-- / Not sure if this part is formatted right / -->
    var mailpre = ("MAILTO:" + document.getElementById("cusub").value + "@cmputers.ca");
     <!-- / Not sure if this part is formatted right / -->
  </script>
</head>
<body>
  <!-- / Not sure if the action part is formatted right / -->
  <form action=mailpre method="post" enctype="text/plain" autocomplete="on" id="contact">
    <!-- / Not sure if the action part is formatted right / -->
    <fieldset>
      <legend>Contact Information</legend>
      Name:
      <br>
      <input type="text" name="clientname" autofocus required>
      <br>E-mail:
      <br>
      <input type="email" name="clientemail" required>
      <br>Telephone Number:
      <br>
      <input type="text" name="clientphone">
      <br>
    </fieldset>
    <fieldset>
      <legend>Subject</legend>
      <select id="cusub" name="subject">
        <option value=""></option>
        <option value="booking">Booking An Appointment</option>
        <option value="support">Technical Support</option>
        <option value="feedback">Feedback</option>
      </select>
      <br>
      <textarea name="message" rows="10" cols="30"></textarea>
      <br>
      <input type="submit" value="Send">
    </fieldset>
  </form>
</body>
</html>

希望有人能帮忙，因为这对我来说很奇怪。

您没有设置action属性。使用FORMELEMENT.action设置action属性。

注意：将脚本放置为body的last child或window.onload hander内，否则DOM API 将无法访问它

编辑：要更新每个change事件的action属性，请使用.addEventListener('change'

var setActionValue = function(value) {
  var mailpre = ("MAILTO:" + value + "@cmputers.ca");
  document.getElementById('contact').action = mailpre;
  alert(document.getElementById('contact').action);
};
document.getElementById('cusub').addEventListener('change', function() {
  setActionValue(this.value);
});
setActionValue(document.getElementById('cusub').value);

<form action=mailpre method="post" enctype="text/plain" autocomplete="on" id="contact">
  <fieldset>
    <legend>Contact Information</legend>
    Name:
    <br>
    <input type="text" name="clientname" autofocus required>
    <br>E-mail:
    <br>
    <input type="email" name="clientemail" required>
    <br>Telephone Number:
    <br>
    <input type="text" name="clientphone">
    <br>
  </fieldset>
  <fieldset>
    <legend>Subject</legend>
    <select id="cusub" name="subject">
      <option value=""></option>
      <option value="booking">Booking An Appointment</option>
      <option value="support">Technical Support</option>
      <option value="feedback">Feedback</option>
    </select>
    <br>
    <textarea name="message" rows="10" cols="30"></textarea>
    <br>
    <input type="submit" value="Send">
  </fieldset>
</form>

演示

用select:更改表单action属性

function premail(){
  document.getElementById('contact').setAttribute('action', "mailto:" + document.getElementById("cusub").value + "@cmputers.ca");
}

<form action="" method="post" enctype="text/plain" autocomplete="on" id="contact">
    <fieldset>
      <legend>Contact Information</legend>
      Name:
      <br>
      <input type="text" name="clientname" autofocus required>
      <br>E-mail:
      <br>
      <input type="email" name="clientemail" required>
      <br>Telephone Number:
      <br>
      <input type="text" name="clientphone">
      <br>
    </fieldset>
    <fieldset>
      <legend>Subject</legend>
      <select id="cusub" onchange="premail()" name="subject">
        <option value=""></option>
        <option value="booking">Booking An Appointment</option>
        <option value="support">Technical Support</option>
        <option value="feedback">Feedback</option>
      </select>
      <br>
      <textarea name="message" rows="10" cols="30"></textarea>
      <br>
      <input type="submit" value="Send">
    </fieldset>
  </form>

第页。S.：您不能单独使用JavaScript发送电子邮件。您需要一个服务器端处理程序来连接SMTP服务器以实际发送邮件。

阅读此线程中的详细信息：

如何使用javascript或jquery 发送电子邮件

相关内容

最新更新

热门标签：