2013-07-08 4 views
0

다음 코드는 id가 "button0"인 버튼을 클릭 할 때마다 양식에 버튼을 추가합니다. 그러나 불을 지르고는 나에게 오류자바 스크립트에 버튼 추가시 문제가 발생했습니다.

form1 is null 
[Break On This Error] 

form1.appendChild(element); 

를 제공하고 새로운 버튼이 그것의 onclick 값 설정되어 있다는 사실에도 불구하고 기능 "() foo는"실행되지 않습니다. 여기에 내가 또 불을 지르고 오류 (정의되지 않은) 내가 document.form1.appendChild (요소)를 사용하는 경우를 얻을 코드

var counter = 0; 

function add(){ 
    counter++; 
    var element = document.createElement("input"); 
    element.type = "button"; 
    element.value = "test"; 
    element.name = "button"+counter; 
    element.id = "button"+ counter; 
    element.onclick="foo()"; 
    var form1 = document.getElementById("form1"); 
    var body1 = document.getElementById("b1"); 
    var header = document.getElementById("header"); 
    form1.appendChild(element); 
    header.innerHTML = "Two Buttons"; 
}; 

function foo(){ 
    var butt = document.getElementById("button1"); 
    butt.value = "works"; 
    console.log("works"); 
}; 

add(); 

이다;

재미있는 점은 클릭 할 때마다 새 버튼을 얻는 것입니다. 단추가 작동하지 않는다는 것입니다.

은 여기 내 html로

<body id = "b1"> 

<script src = "button-in-code.js"></script> 
<h1 id = "header">Buttons</h1> 
<form id = "form1" name = "form1"> 
<input type="button" id = "button0" name="sel" value="Select all" onclick="add()"> 
</form> 

<hr> 
<address></address> 
<!-- hhmts start -->Last modified: Mon Jul 8 10:07:26 EDT 2013 <!-- hhmts end --> 
</body> </html> 
+0

HTML을 추가 할 수 있습니까? 대부분의 이슈가'form1'이라는 요소를 찾지 못하는 것 같기 때문에 이것은 html 문제 일 수 있습니다. jsfiddle.net이나 jsbin.com과 같은 사이트에서 이것을 설정하는 것도 도움이 될 수 있습니다. –

+3

문자열이 아닌'.onclick'에 함수를 할당해야합니다. –

+0

DOM에서이 코드를 사용할 준비가 되었기를 바랍니다. –

답변

0

<form>...</form>와 HTML 코드 후 <script src = "button-in-code.js"></script>를 추가하려고합니다.

add(); 함수가 자동으로 실행되므로 해당 함수에서 사용되는 html 요소 뒤에 javascript 코드를 추가해야합니다.

+0

CoursesWeb의 대답에 따라 add()! 감사. 내가 남긴 유일한 문제는 클릭 할 때 새 버튼이 foo()를 실행하지 않는다는 것입니다. – user2534010

+0

관련 코드 줄은'element.onclick = foo;'이어야합니다. 이것은 이벤트 리스너를 연결하는 기본 메서드가 아닙니다. JS 라이브러리를 사용하여 여러 브라우저에서 이벤트 처리를 간소화하는 것이 좋습니다. – MasterAM

+0

감사합니다 MasterAM! 그게 효과가 있었어. – user2534010

관련 문제