0

我们如何从 1 个按钮触发 2 个动作?我们如何制作一个可以转到/滚动到元素“#result”并触发功能“calculateThis”的按钮/或链接(从表单中处理数据)

如何将这些混合成 1 个按钮/链接?

 <a href="#result">Submit</a>

 <button class="button" onclick="calculateThis(this.form); return false;">Submit</button>

//更新这里是完整的代码

<script type="text/javascript">
function calculateThis(form) {
var userweight=parseInt(form.weight.value, 10);
var caffeineamount=parseInt(form.caffein.value, 10);
var caffeinetimes=parseInt(form.caffeintimes.value, 10);
var totalcaffeine=caffeineamount*caffeinetimes;

console.log(totalcaffeine)
// Calculate max caffeine per person
var maxcaffeine=userweight*10;

// Calculate remaining after 24 hours
// Half life = 6 hours
var totalcaffeineafter=totalcaffeine*(1/16);

// Calculating how many hours until the caffeine completely digested
var totaldigest=totalcaffeine;
var digesttime=0;

while (totaldigest>0.05) {
totaldigest=totaldigest*(1/2);
digesttime++;
}

digesttime=digesttime*6;

// Calculating when the user will probably die of overdose
var countcaffeine=0;
var overdosetime=1;

while (countcaffeine<maxcaffeine){
countcaffeine=countcaffeine+totalcaffeine;
overdosetime++;
}

// Show total amount of caffeine
document.getElementById("showtotalkafein").innerHTML=totalcaffeine;

// Show amount of caffeine after 1 day
document.getElementById("showtotalkafeinsetelah").innerHTML=totalcaffeineafter;

// Show digest time
document.getElementById("showwaktudigest").innerHTML=digesttime;

// Show overdose
document.getElementById("showberapakali").innerHTML=overdosetime;

return false;
}
</script>

<form class="form">
Weight<br />
<input type="text" name="weight" class="required" value="" /><p /> 
Amount of caffein in coffee<br />
<input type="text" name="caffein" class="required" value="" /><p /> 
How many times drinking coffeein a day<br />
<input type="text" name="caffeintimes" class="required" value="" /><p />
<a href="#result" onClick="calculateThis(this.form); return false;">Submit</a>
</form>
<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />&nbsp;<br />

<h1 id="result">Result</h1>
<p id="showtotalkafein">Show Caffein Total Here</p> 
<p id="showtotalkafeinsetelah">Show Caffeine Amount After 24 hours</p> 
<p id="showwaktudigest">Show Digest Time Here</p> 
<p id="showberapakali">Show Overdose Time Here</p>
4

2 回答 2

1

您应该能够执行与按钮中相同的操作,即

<a href="#result" onClick="calculateThis(this.form); return false;">Submit</a>

这不行吗?

于 2012-06-09T18:29:03.503 回答
0

JaggenSWE 的答案几乎就在那里,但不要返回 false,因为这会抑制默认行为,即遵循链接。

<a href="#result" onClick="calculateThis(this.form);">Submit</a>

我不建议使用内联事件处理程序。

编辑

这行得通。http://jsbin.com/uwatab/3/

总是最好将 onsubmit 处理程序附加到表单,而不是按钮 onclick。这样,在您的表单中按 enter 仍然会执行您的 javascript。

于 2012-06-09T18:33:56.027 回答