Question

我正在努力使用正确的语法来更改您使用javascript进行onclick的链接。

我有：

JS：

function changeLink {
link = "page2.php";
document.getElementById('go').onclick= function() { location.href(link); };
}

HTML：

<button type="submit" name="submit1" style="width:100%;height:30px" onclick="changeLink();">Change Place To Go</button>
<div id="go" onclick="document.location.href='page1.php';">Click to go somewhere</div>

JS fiddle

感谢您的任何建议！

Answer 1

让我们从一些common.js开始：

//<![CDATA[
var doc = document, bod = doc.body;
var IE = parseFloat(navigator.appVersion.split('MSIE')[1]);
bod.className = 'js';
function gteIE(version, className){
  if(IE >= version){
    bod.className = className;
  }
}
function E(e){
  return doc.getElementById(e);
}
//]]>

现在让我们来做主页index.php：

//<![CDATA[
function direct(id, link){
  E(id).onclick = function(){
    location = link;
  }
}
direct('button1', 'page1.php'); direct('button2', 'page1.php');
//]]>

HTML看起来更像：

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
  <head>
    <meta http-equiv='content-type' content='text/html;charset=utf-8' />
    <style type='text/css'>
      @import 'common.css'; @import 'index.css';
    </style>
  </head>
<body class='njs'>
  <div id='main'>
    <input type='button' id='button1' value='button 1' />
    <input type='button' id='button2' value='button 2' />
  </div>
  <script type='text/javascript' src='common.js'></script>
  <script type='text/javascript' src='index.js'></script>
</body>
</html>

common.css上的CSS：

body{
  margin:0;
}
#main{
  width:980px; margin:0 auto;
}

index.css上的CSS：

#button1,#button2{
  height:30px; width:300px;
}

注意：

您可以使用CSS class代替逗号分隔的id。这只是为了向您展示语法应该是什么样子。您应该知道onclick在表单提交之前触发，因此重定向将在提交之前发生，因此使用submit按钮没有意义。除非您能解释原因，否则在您的案例中填写表格毫无意义。我只想使用<a href='page1.php'>page 1</a>之类的，所以你甚至不需要使用JavaScript。您可以使用CSS将链接设置为按钮样式。

javascript / html：如何使用document.getElementById更改onclick = location.herf

1 个答案: