简单javascript错误-单击按钮在表单提交时追加查询字符串
我有一个简单的表单，当点击一个按钮时，它通过连接计算一个链接，并通过覆盖现有方法在同一页面上输出链接。页面不应重定向到任何地方，甚至不应重定向到自身 问题是它在URL中附加了一个查询字符串（即/linkgenerator.html变成/linkgenerator.html？generatelink=Generate+Link#），这实际上导致了两种情况： 1） 表单第一次正确提交，然后立即重新加载页面，从而丢失您的输入。一旦你在重新加载的页面上再次提交，你就没事了 2） 当在IE7中的本地文件系统上运行时，查询字符串会导致脚本不工作（period）简单javascript错误-单击按钮在表单提交时追加查询字符串,javascript,html,Javascript,Html,我有一个简单的表单，当点击一个按钮时，它通过连接计算一个链接，并通过覆盖现有方法在同一页面上输出链接。页面不应重定向到任何地方，甚至不应重定向到自身 问题是它在URL中附加了一个查询字符串（即/linkgenerator.html变成/linkgenerator.html？generatelink=Generate+Link#），这实际上导致了两种情况： 1） 表单第一次正确提交，然后立即重新加载页面，从而丢失您的输入。一旦你在重新加载的页面上再次提交，你就没事了 2） 当在IE7中的本地文件系
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SRP Link Generator</title>
<script language="javascript" type="text/javascript">
function dogeneratelink()
{
var code1= document.getElementById("code1").value;
var brand = document.getElementById("brand").value;
var code2= document.getElementById("code2").value;
var errors = checkerrors(prop, srp);
if (errors)
{
alert(errors);
return;
}
var link = "http://www." + brand + ".com/" + code1 + "/" + code2;
var a = document.getElementById("link");
a.href = link;
a.textContent = link;
}
function doclear()
{
var a = document.getElementById("link");
a.href = '';
a.textContent = '';
}
function checkerrors(code1, code2)
{
var errors;
var propset;
if (code1.length != 5)
{
errors = "You must enter a valid Code 1";
code1set = 1;
}
if ((code2.length < 4) || (code2.length > 5))
{
if (code1set == 1)
{
errors += " and Code 2";
}
else
{
errors = "You must enter a valid Code 2";
}
}
return errors;
}
</script>
</head>
<body>
<form action="#">
<h1>Link Generator</h1>
<div class="row">
<label>Code 1:</label>
<input type="text" id="code1" />
</div>
<div class="row">
<label>Brand:</label>
<select id="brand">
<option value="brand1">Brand 1</option>
<option value="brand2">Brand 2</option>
<option value="brand3">Brand 3</option>
</select>
</div>
<div class="row">
<label>Code 2:</label>
<input type="text" id="code2" />
</div>
<div class="row">
<div class="buttonrow">
<input type="submit" onclick="dogeneratelink()" id="generatelink" name="generatelink" value="Generate Link" class="button"/>
<input type="submit" onclick="doclear()" id="clear" value="Clear" class="button"/>
</div>
</div>
</form>
<div id="generatedlink"><a id="link"></a></div>
</body>
</html>
SRP链路发生器
函数dogeneratelink（）
{
var code1=document.getElementById（“code1”）.value；
var brand=document.getElementById（“品牌”）.value；
var code2=document.getElementById（“code2”）.value；
var错误=检查错误（道具、srp）；
如果（错误）
{
警报（错误）；
返回；
}
变量链接=”http://www.“+brand+”.com/“+code1+”/“+code2；
var a=document.getElementById（“链接”）；
a、 href=链接；
a、 text内容=链接；
}
函数doclear（）
{
var a=document.getElementById（“链接”）；
a、 href=''；
a、 textContent=''；
}
函数检查错误（代码1、代码2）
{
var误差；
向量集；
如果（代码1.length！=5）
{
errors=“您必须输入有效的代码1”；
code1set=1；
}
如果（（代码2.length<4）| |（代码2.length>5））
{
if（code1set==1）
{
错误+=“和代码2”；
}
其他的
{
errors=“您必须输入有效的代码2”；
}
}
返回错误；
}
链路发生器
代码1：
品牌：
品牌1
品牌2
品牌3
代码2：
<form action="" onsubmit="return false;">
<button type="button" onclick="something();">Click Me!</button>
点击我！
<a href="#" class="button" onclick="something();">Click Me!</a>
查看这个工作示例，它比您要做的要简单得多。请注意，单击按钮后，链接和指向这两个链接的位置将发生更改。您可以向文本框添加内容，它将更改链接的href
你已经把自己变成了一个非常复杂的代码。首先，使用jQuery（学习曲线非常小，收益非常巨大）。然后，简化您要做的事情。您不需要提交表单，因为您不必向服务器发布任何内容，所有工作都由客户端完成。 有两种方法可以解决此问题： 向onclick处理程序添加“return false”
<input type="submit" onclick="dogeneratelink(); return false" id="generatelink" name="generatelink" value="Generate Link" class="button"/>
<input type="submit" onclick="doclear(); return false" id="clear" value="Clear" class="button"/>
<input type="button" onclick="dogeneratelink()" id="generatelink" name="generatelink" value="Generate Link" class="button"/>
<input type="button" onclick="doclear()" id="clear" value="Clear" class="button"/>