javascript - How to replace html href link with button -
i have html page has javascript in (see below).
within html page there html code line calls javascript function. works should , looks :
<a href="#" id="hour">hour</a> this code line calls last part of below javascript.
i wish replace code line button. how can ?
thank
ps javascript use dygraph , did not write it. know little javascript. i'm looking replace above single line of html button same job or produce button through other minimalistic change.
$(document).ready(function () { var r = [ ]; var base_time = date.parse("2014/03/05"); var num = 24 * 0.25 * 365; (var = 0; < num; i++) { r.push([ new date(base_time + * 3600 * 1000), + 50 * (i % 60), // line * (num - i) * 4.0 / num // parabola ]); } var orig_range = [ r[0][0].valueof(), r[r.length - 1][0].valueof() ]; // new code inserted - starts var one_month_previous = new date(); one_month_previous.setmonth(one_month_previous.getmonth() - 1); var one_week_previous = new date(); one_week_previous.setdate(one_week_previous.getdate()-7); var three_days_previous = new date(); three_days_previous.setdate(three_days_previous.getdate()-3); var one_days_previous = new date(); one_days_previous.setdate(one_days_previous.getdate()-1); var twelve_hours_previous = new date(); twelve_hours_previous.sethours(twelve_hours_previous.gethours() - 12); // new code inserted - ends g = new dygraph( document.getelementbyid("graphdiv3"), "show_csv.php", { // new code inserted - starts // datewindow: [ date.parse(one_month_previous) , // date.parse(new date()) ], datewindow: [ date.parse(one_week_previous), date.parse(new date()) ], // datewindow: [ date.parse(three_days_previous) , // date.parse(new date()) ], // datewindow: [ date.parse(one_days_previous) , // date.parse(new date()) ], // datewindow: [ date.parse(twelve_hours_previous) , // date.parse(new date()) ], // datewindow: [ date.parse("2014/03/01 12:00:00"), // date.parse("2014/03/31 12:00:00") ], // new code inserted - ends title: 'temperature(°c) vs time', rollperiod: 1, showroller: true, xlabel: 'time', ylabel: 'temperature (°c)', legend: 'always', labelskmb: 'true', labelsseparatelines: 'true', colors: [ "rgb(51,204,204)", "#00dd55", "rgb(255,100,100)", "rgba(50,50,200,0.4)" ] } ); var desired_range = null; function approach_range() { if (!desired_range) return; // go halfway there var range = g.xaxisrange(); if (math.abs(desired_range[0] - range[0]) < 60 && math.abs(desired_range[1] - range[1]) < 60) { g.updateoptions({datewindow: desired_range}); // (do not set timeout.) } else { var new_range; new_range = [ 0.5 * (desired_range[0] + range[0]), 0.5 * (desired_range[1] + range[1]) ]; g.updateoptions({datewindow: new_range}); animate(); } } function animate() { settimeout(approach_range, 50); } var zoom = function(res) { var w = g.xaxisrange(); desired_range = [ w[0], w[0] + res * 1000 ]; animate(); } var reset = function() { desired_range = orig_range; animate(); } var pan = function(dir) { var w = g.xaxisrange(); var scale = w[1] - w[0]; var amount = scale * 0.25 * dir; desired_range = [ w[0] + amount, w[1] + amount ]; animate(); } document.getelementbyid('hour').onclick = function() { zoom(3600); }; document.getelementbyid('day').onclick = function() { zoom(86400); }; document.getelementbyid('week').onclick = function() { zoom(604800); }; document.getelementbyid('month').onclick = function() { zoom(30 * 86400); }; document.getelementbyid('full').onclick = function() { reset(); }; document.getelementbyid('left').onclick = function() { pan(-1); }; document.getelementbyid('right').onclick = function() { pan(+1); }; });
just style way now!=)
(ie optimized:) not sure if right tho.
<a href="#"> <button id="hour">hour</button> </a> normal button
<button id="hour">hour</button> form method:
<form action="#"> <input type="submit" value="submit"> </form>
Comments
Post a Comment