根据下拉菜单选择打开文件
问题描述:
网站开发新手。我有一个单选按钮和两个下拉菜单。每个这些事项的选择,并将决定哪个文件将打开。当进行每次选择并且用户点击“提交”时,我希望页面打开相应的Excel文件。根据下拉菜单选择打开文件
我有单选按钮和下拉内置,但是当我按下提交时,没有任何反应。我试图在PHP中这样做,使其更加动态,并避免有这么多的if/else语句,但PHP在我的服务器上无法正常运行,所以我选择使用JavaScript,这会导致if语句更多,但至少会是功能性的。
这是我的JavaScript:
<script type="text/javascript">
var excelObject;
excelObject = new ActiveXObject("Excel.Application");
excelObject.Visible = true;
excelObject.Workbooks.Open(strLocation, false, boolReadOnly);
//x, y, and z are the variables for the dropdowns/radio button
var x = document.getElementByID("x");
var y = document.getElementByID("y");
var z = document.getElementByID("z");
window.onload = function(){
document.getElementByID("x").innerHTML=x;
document.getElementByID("y").innerHTML=y;
document.getElementByID("z").innerHTML=z;
function docOpen(){
if (x == "test" && y ="cat" && z == "claws"){
readFile('file:\\folder\folder\test_cat_claws.xls');
这是我补充的形式:
<form name ='myform' method="post" onSubmit="Javascript:docOpen()" >
而这正是我按下提交:
<input type= "submit" value="Submit" name="Submit" onclick="Javascript:docOpen(); return false;"/>
编辑: 整个代码 - 编辑,以便更为通用:
<html lang=''>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript">
var x = document.getElementByID("x");
var y = document.getElementByID("y");
var z = document.getElementByID("z");
window.onload = function(){
document.getElementByID("x").innerHTML=x;
document.getElementByID("y").innerHTML=y;
document.getElementByID("z").innerHTML=z;
function docOpen(){
if (x == "test" && y =="cat" && z == "claws"){
var excelObject;
excelObject = new ActiveXObject("Excel.Application");
excelObject.Visible = true;
excelObject.Workbooks.Open('file:\your_excel_file_location_here.xlsx', false, boolReadOnly);
}
</script>
<title>Title</title>
</head>
<body>
<div class="page">
<div class="header">
<table border="0px"><tr><td>
<td id="pagetitle"><h1>Page Title</h1></td>
<td><iframe src="" height="60" width="280" style="border:none" scrolling="no";> </iframe></td></tr></table>
</div>
<div id="includedContent"></div>
<div class="main" id="MainContent">
<div class="form_table">
<!--<div class="clear"></div>-->
<form name ='myform'>
<div id="q0" class="q required">
<a class="item" name="radiobutton0"></a>
<table class="inline_grid">
<tr>
<td> <input type="radio" name="x" id="x" value="test" />Test</label></td>
<td> <input type="radio" name="x" id="x" value="test2" />Test2</label></td>
</tr>
</table>
</div>
<div class="clear"></div>
<div id="q1" class="q required">
<a class="item" name="dropdown1"></a>
<label> <b class="icon_required" style="color:#FF0000">*</b></label>
<select id="y" name="y" class="drop_down">
<option></option>
<option value="cat">Cat</option>
<option value="dog">Dog</option>
<option value="bird">Bird </option>
</select>
</div>
<div id="q2" class="q required">
<a class="item" name="dropdown2"></a>
<label> <b class="icon_required" style="color:#FF0000">*</b></label>
<select id="z" name="z" class="drop_down">
<option></option>
<option value="claws">Claws</option>
<option value="paws">Paws</option>
</select>
</div>
<div class="clear"></div><br/>
<input type="Submit" name="Submit" onclick="docOpen();"/>
</form>
</div>
<div class="clear">
</div>
</div>
</body>
</html>
答
好了,几件事情需要注意:
看来好像在你的逻辑,你被错误使用比较运算符和使用单个=
而不是两个==
进行比较。改变看起来像这样。
if (x == "test" && y =="cat" && z == "claws")
此外,您可能正在初始化ActiveXObject太早(?)。为什么条件满足后无法创建Excel工作表,就像这样:
if (x == "test" && y =="cat" && z == "claws"){
var excelObject;
excelObject = new ActiveXObject("Excel.Application");
excelObject.Visible = true;
excelObject.Workbooks.Open(strLocation, false, boolReadOnly);
这样,你的代码不会甚至懒得打开电子表格,除非他们满足特定的标准。
此外,从我所知道的,readFile()
不是一个有效的js函数。您需要将文件位置传递给excelObject.Workbooks.Open
函数的第一个参数。因此,所有说,你的代码将是这个样子:
//x, y, and z are the variables for the dropdowns/radio button
var x = document.getElementByID("x");
var y = document.getElementByID("y");
var z = document.getElementByID("z");
window.onload = function(){
document.getElementByID("x").innerHTML=x;
document.getElementByID("y").innerHTML=y;
document.getElementByID("z").innerHTML=z;
}
function docOpen(){
if (x == "test" && y =="cat" && z == "claws"){
var excelObject;
excelObject = new ActiveXObject("Excel.Application");
excelObject.Visible = true;
excelObject.Workbooks.Open('file:\your_excel_file_location_here.xlsx', false, boolReadOnly);
}
}
再次,你要知道,这只会在IE浏览器给您的使用ActiveXObjects的。也许这已经足够满足您的需求。
与完整的代码编辑:
<html lang=''>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<div class="page">
<div class="header">
<table border="0px"><tr><td>
<td id="pagetitle"><h1>Page Title</h1></td>
<td><iframe src="" height="60" width="280" style="border:none" scrolling="no";> </iframe></td></tr></table>
</div>
<div id="includedContent"></div>
<div class="main" id="MainContent">
<div class="form_table">
<!--<div class="clear"></div>-->
<form name ='myform'>
<div id="q0" class="q required">
<a class="item" name="radiobutton0"></a>
<table class="inline_grid">
<tr>
<td> <input type="radio" name="x" id="x1" value="test" />Test</label></td>
<td> <input type="radio" name="x" id="x" value="test2" />Test2</label></td>
</tr>
</table>
</div>
<div class="clear"></div>
<div id="q1" class="q required">
<a class="item" name="dropdown1"></a>
<label> <b class="icon_required" style="color:#FF0000">*</b></label>
<select id="y" name="y" class="drop_down">
<option></option>
<option value="cat">Cat</option>
<option value="dog">Dog</option>
<option value="bird">Bird </option>
</select>
</div>
<div id="q2" class="q required">
<a class="item" name="dropdown2"></a>
<label> <b class="icon_required" style="color:#FF0000">*</b></label>
<select id="z" name="z" class="drop_down">
<option></option>
<option value="claws">Claws</option>
<option value="paws">Paws</option>
</select>
</div>
<div class="clear"></div><br/>
</form>
<button onclick="docOpen(); return;">button</button>
</div>
<div class="clear">
</div>
</div>
<script type="text/javascript">
function docOpen(){
var x = document.querySelectorAll('input[type="radio"]:checked')[0].value;
var ySelect = document.getElementById('y');
var y = ySelect.options[ySelect.selectedIndex].value;
var zSelect = document.getElementById('z');
var z = zSelect.options[zSelect.selectedIndex].value;
if (x == "test" && y =="cat" && z == "claws"){
var excelObject;
excelObject = new ActiveXObject("Excel.Application");
excelObject.Visible = true;
excelObject.Workbooks.Open('file:\excel.xlsx');
}
}
</script>
</body>
</html>
刚抬起头,因为你使用ActiveX对象的代码只会在IE –
工作的这段代码将只能在IE中执行 - 使它成为有点困难。 @AlexanderEdwards – AAA
明白了,检查我的答案。 –