根据表单元素更改网页标题答案

【问题标题】：Change title of web page according to form elements根据表单元素更改网页标题
【发布时间】：2014-09-19 02:33:10
【问题描述】：

我希望根据某些表单元素以及在该页面上找到的一些文本来更改 html 页面的标题。我找到了一个很好的网站，描述了如何使用 Javascript 几乎可以完成我需要的工作，位于：http://www.devx.com/tips/Tip/13469。发现脚本的问题是更改标题的选项仅限于文本区域，或者如果我尝试包含另一个元素，我会收到一条错误消息。我创作了网页/表单模板，没有什么复杂的，其中的目标用户，容我们说，不是很懂计算机（其中一个从未使用过计算机），填写某些文本区域和下拉选项，然后保存ARCHIVE 文件夹中的页面。为了让他们更容易，我想给他们保存页面的奢侈，而不必输入相关的日期和#（每个表格基本上是一系列 59 中的一个），基本上标准化了保存页面的标题将来应该更容易使用另一个脚本对它们进行分类。下面的代码（在上面的网站中找到的那个）是否可以扩展为包含多个 html 项，例如下面的 select 下拉选项，以及可能在元素内部找到的内容，例如a 还是 div?

<HTML>
<HEAD><TITLE>Change Title Dynamically:</TITLE></HEAD>
<BODY>
<FORM action="" method=POST name="SampleForm">
<B>Enter Title for the window:</B>
<TEXTAREA NAME=WindowTitle ROWS=1 COLS=50></TEXTAREA>
<INPUT TYPE=BUTTON VALUE="Change Title" ONCLICK="javascript:UpdateTitle()">
</FORM>
<SCRIPT LANGUAGE="JAVASCRIPT">
<!--
function UpdateTitle()
{
document.title = document.SampleForm.WindowTitle.value;
}
</SCRIPT>
</BODY>
</HTML>

<SELECT>
<option>-----</option>
<OPTION>JAN</OPTION>
<OPTION>FEB</OPTION>
<OPTION>MAR</OPTION>
<OPTION>APR</OPTION>
<OPTION>MAY</OPTION>
<OPTION>JUN</OPTION>
<OPTION>JUL</OPTION>
<OPTION>AUG</OPTION>
<OPTION>SEP</OPTION>
<OPTION>OCT</OPTION>
<OPTION>NOV</OPTION>
<OPTION>DEC</OPTION>
</SELECT>

【问题讨论】：

我认为你需要先学习一些 html 基础知识。

标签： javascript forms

【解决方案1】：

我会推荐 jQuery 来获取你想在标题中显示的字段的值并设置它。更多关于 jQuery 的信息可以在http://jquery.com/找到。

您可以使用 jQuery 选择器来获取字段的值并相应地连接它。像这样的：

document.title = $('textarea').val() + ' - '  + $('select').val();

【讨论】：

太好了，做到了。我添加了以下代码来刷新页面：点击刷新页面。至少有 4 人认为我的帖子/问题浪费了他们的时间，所以谢谢！