我正在做一个学校项目,试图列出你需要购买的东西。 问题是,我不能写多次并添加到列表中,我无法弄清楚原因。 (它远未完成。)(我必须使用不同的javascript文件)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link href="main.css" type="text/css" rel="stylesheet">
<title>Inköpslista</title>
</head>
<body>
<div id="kol1" class="kol">
<h1>Inköp</h1>
<input type="image" src="img/button.png" alt="Submit" id="storknapp" onclick="klickaKnapp('skriva')"/>
<input type"text" id="skriva" placeholder="Skriv din vara här!"/>
<input type="image" id="knapp" src="pluss.png" alt="Submit"/>
</div>
<div id="kol2">
<ul id="listaavvara"></ul>
</div>
<script src="menudropdown.js" type="text/javascript"></script>
<script type="text/javascript" src="java.js"></script>
</body>
</html>
function laggtill(cool, namnVara) {
var vara = document.createElement("li");
vara.innerText = namnVara;
cool.appendChild(vara);
}
var button = document.getElementById("knapp");
button.onclick = function() {
var skriva = document.getElementById("skriva")
var namnVara = skriva.value;
if(!namnVara|| namnVara =="" || namnVara == " " ){
return false;
}
laggtill(document.getElementById("listaavvara"), namnVara);
};
javascrpit 2:
function klickaKnapp(x){
var skrivrutan = document.getElementById(x), maxH="100px";
if(skrivrutan.style.height == maxH){
skrivrutan.style.height = "0px";
} else {
skrivrutan.style.height = maxH;
}
}
你真的知道我的意思! (我的照片不在这里)
答案 0 :(得分:0)
由于
var button = document.getElementById("knapp");
button.onclick = function() { ... }
覆盖内联事件处理程序。您需要使用addEventListener
button.addEventListener("click", function(){...}, false);
答案 1 :(得分:0)
你的例子适用于小提琴:http://jsfiddle.net/7zjb86ab/
所以这看起来导入的脚本有问题
<script src="menudropdown.js" type="text/javascript"></script>
<script type="text/javascript" src="java.js"></script>
这两个文件是否包含您的javascript片段?
您也可以尝试替换
var button = document.getElementById("knapp");
button.onclick = function() {
带
function addItem() {
然后将该函数添加为onclick属性,就像使用klickaKnapp函数
一样<input type="image" id="knapp" src="pluss.png" alt="Submit" onclick="addItem()" />