javascript,更改页面内容
我正在尝试做一个使用javascript更改页面内容的示例。假设我有一个页面:javascript,更改页面内容
<html>
<head>
</head>
<body>
<select id="a96780" multiple="multiple" name="a96780" size="3" value="deneme">
<option selected="selected" value="#ANY">ALL</option>
<option value="1111294">Ex1</option>
<option value="1111292">Ex2</option>
<option value="1111290">Ex3</option>
</select>
</body>
</html>
我希望能够关闭所有的选项,练习1,实例2,实例3(设置其类型的隐藏或通过其他方式)的页面加载时。为了实现这一点,我跟着但是网上的指令未能通过做这样做:
<script type="text/javascript">
function myFunction()
{
var selectBox = document.getElementById("a96780");
alert("smt");
alert(selectBox.name);
}
myFunction();
</script>
在上面的脚本中,我试图打印出该元素的名称,以确认我其实有保留的。但是最后一行永远不会被打印。我如何确认我已经将元素初始化为selectBox,并且应该如何从那里继续。选项值是否足以提及项目:“Ex1,Ex2和Ex3”?
编辑1:我绝对没有链接到html,我不能修改body标签,也不能放任何可以启动myFunction的按钮,因此无论我做什么,我都必须通过js来完成。除此之外,如果你能指导我如何继续下去,这也将是美好的。例如,我可以从它们的值中引用选项项吗?
我的解决办法是:
<html>
<head>
<script type="text/javascript">
function initialTypeCorrection()
{
var selectBox = document.getElementById("a96780");
if(selectBox != null)
{
var options = selectBox.getElementsByTagName("option");
for (var i = 0; i < options.length; i ++)
{
// Alternative 1
if(options[i].value=="1111294" || options[i].value=="1111292" || options[i].value=="1111290")
{
options[i].disabled = "true";
options[i].text = "";
}
}
}
}
window.onload = initialTypeCorrection;
</script>
</head>
<body>
<select id="a96780" multiple="multiple" name="a96780" size="4">
<option selected="selected" value="#ANY">all</option>
<option value="1111294">a1</option>
<option value="1111292">a2</option>
<option value="1111290">a3</option>
</select>
</body>
</html>
你可能想尝试
<body onload="myFunction()">
与其说这是在脚本标签,因为当JavaScript是在身体标记的东西不被初始化。
您需要等到DOM完全加载。这意味着HTML已被浏览器理解和组织。如果在此之前执行javascript,则元素将不存在,因此不会被操纵或打印。等待DOM加载
的一种方法是通过将函数调用到body标签的onload
...
<body onload="myFunction();">
Regarging你的问题的这部分:“我希望能够关闭所有运蒸发散,练习1,实例2,实例3(设置其类型的隐藏或通过其他方式),在页面加载时”
function closeAllOptions() { var slc = document.getElementById("a96780"), i, opt; for (i=0; opt=slc[i]; i++) { if (opt.value!="#ANY") { opt.disabled=true; // update opt.style.display="none"; } } } function relaseAllOptions() { var slc = document.getElementById("a96780"), i, opt; for (i=0; opt=slc[i]; i++) { opt.disabled=false; // update opt.style.display=""; } }
测试:http://jsfiddle.net/44fQX/1/
UPDATE http://jsfiddle.net/44fQX/3/
选择禁用使他们无法选择,但仍然可见,有没有办法让他们隐藏或销毁? – Pumpkin 2012-08-07 10:43:29
是的,查看更新。 – 2012-08-07 10:48:54
如果你可以在你的答案中提供代码总是更好(最好只是showin g的变化,而不是期望人们找到你所改变的)。这是因为这个链接不能保证将来仍然存在,你可能会得到公认的答案! – freefaller 2012-08-07 08:05:54
对不起:) :) – LmC 2012-08-07 08:13:52
没有道歉,只是想帮助 – freefaller 2012-08-07 08:15:10