Html按钮点击时更新图表
问题描述:
我有3个不同的索引(indexsc/indexol/indexsa)保存的3个不同的图表(相同类型但显示不同的东西)。Html按钮点击时更新图表
是否可以使用从按钮中选择的图形来刷新或重新加载页面,而无需每次都打开一个新窗口?
我对此的理解是调用3个不同子代码的核心代码。
<form>
<input type="button" value="Chart SC" onclick="window.open('indexsc.html', 'height=600, width=800, top=90, left=350, toolbar=no, menubar=no, location=yes, resizable=yes, scrollbars=yes, status=no');">
<input type="button" value="Chart OL" onclick="window.open('indexol.html', 'height=600, width=800, top=90, left=350, toolbar=no, menubar=no, location=yes, resizable=yes, scrollbars=yes, status=no');">
<input type="button" value="Chart SA" onclick="window.open('indexsa.html', 'height=600, width=800, top=90, left=350, toolbar=no, menubar=yes, location=yes, resizable=yes, scrollbars=yes, status=no');">
</form>
答
您可以使用iframe。当然还有javascript的组合。你可以这样做。
JS
function getpage(y){
var x=y;
if(x=="one"){
document.getElementById("one").src="page4.html";
}
if(x=="two"){
document.getElementById("two").src="page2.html";
}
if(x=="three"){
document.getElementById("three").src="page3.html";
}
}
HTML
<form>
<input type="button" value="Chart SC" onClick="getpage('one')">
<input type="button" value="Chart OL" onclick="getpage('two')"">
<input type="button" value="Chart SA" onclick="getpage('three')"">
</form>
<div class="column">
<div class="row chartone">
<iframe id="one" src="page1.html" height="200" width="300"></iframe>
</div>
<div class="row charttwo">
<iframe id="two" src="page2.html" height="200" width="300"></iframe>
</div>
<div class="row chartthree">
<iframe id="three" src="page3.html" height="200" width="300"></iframe>
</div>
</div>
现在
你可以操纵你的页面加载...当按钮点击
投票,如果有帮助