![](/img/trans.png)
[英]Javascript - Retrieve input value from a selected checkbox and do something with it
[英]javascript Retrieve input value from a selected checkbox and display multiple html file in same webpage
當前,當選中所有復選框時,此代碼將打開4個新選項卡,但是我需要所有4個頁面結果(4 html)文件才能在單個窗口或單個html文件或類似的窗口中打開,有什么可以幫助嗎?
function submit() { var box1 = document.getElementById('box1'); var box2 = document.getElementById('box2'); var box3 = document.getElementById('box3'); var box4 = document.getElementById('box4'); var urls = []; if (box1.checked) { urls.push(box1.value); } if (box2.checked) { urls.push(box2.value); } if (box3.checked) { urls.push(box3.value); } if (box4.checked) { urls.push(box4.value); } urls.forEach(function(url) { goToUrl(url); }); } function goToUrl(url) { var win = window.open(url, '_blank'); }
<html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="no-j-boxes.js"></script> </head> <body> <input type="checkbox" name="box1" value="http://box1url.com" id="box1"><label>box1</label><br/> <input type="checkbox" name="box2" value="http://box2url.com" id="box2"><label>box2</label><br/> <input type="checkbox" name="box3" value="http://box3url.com" id="box3"><label>box3</label><br/> <input type="checkbox" name="box4" value="http://box4url.com" id="box4"><label>box4</label><br/> <input type="button" value="Submit" name="submitButton" onclick="submit()"> </body> </html>
這是html
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="no-j-boxes.js"></script>
</head>
<body>
<input type="checkbox" name="box1" value="http://box1url.com" id="box1"><label>box1</label><br/>
<input type="checkbox" name="box2" value="http://box2url.com" id="box2"><label>box2</label><br/>
<input type="checkbox" name="box3" value="http://box3url.com" id="box3"><label>box3</label><br/>
<input type="checkbox" name="box4" value="http://box4url.com" id="box4"><label>box4</label><br/>
<input type="button" value="Submit" name="submitButton" onclick="submit()">
<div id="your_div_where_you_put_all_iframes"></div>
</body>
</html>
這是腳本
<script>
function submit() {
var box1 = document.getElementById('box1');
var box2 = document.getElementById('box2');
var box3 = document.getElementById('box3');
var box4 = document.getElementById('box4');
var urls = [];
if (box1.checked) {
urls.push(box1.value);
}
if (box2.checked) {
urls.push(box2.value);
}
if (box3.checked) {
urls.push(box3.value);
}
if (box4.checked) {
urls.push(box4.value);
}
urls.forEach(function(url) {
goToUrl(url);
});
}
function goToUrl(url) {
$('<iframe src="'+url+'" frameborder="0" scrolling="no" ></iframe>').appendTo('#your_div_where_you_put_all_iframes');
}
</script>
嘗試像這樣附加iframe。 希望能幫助到你 !
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.