JS：在帶有onlick事件的文本框中顯示數組項目？

我正在解決一個問題，但我無法確定它爲什麼不能正常工作。我所要做的就是將輸入值存儲到數組中，並使用onclick事件處理程序將它們顯示到文本框中。任何人都可以幫助我嗎？JS：在帶有onlick事件的文本框中顯示數組項目？

這裏是我的代碼（HTML，CSS，JavaScript的）：https://jsfiddle.net/3486kwtn/

只有JavaScript：

//FUNCTION 
      var $ = function (id) { 
       return document.getElementById(id); 
      } 

//ONLOAD EVENT HANDLER 
      window.onload = function() { 
      var taskList = []; 
      var newTask = $("new_task"); 
      var scr = $("task_list"); 
      var nextTask = $("next_task") 

      $("add_task").onclick = 
       function() { 
        taskList.push(newTask.value); 
        scr.innerHTML = taskList.join("\n"); 
        clear(); 
       } 

       $("show_next_task").onclick = 
        function() { 
         nextTask.push(scr.value); 
         nextTask.innerHTML = taskList; 
         taskList.shift(); } 

      function clear() { 
       newTask.value = ""; 

      } 

      }

來源

2015-09-27 ebyrock

您是否收到任何錯誤？ – Manu

你的代碼正常工作，沒有變化..在JSfiddle中，window.onload不會工作。試一試簡單的HTML文件並加載到瀏覽器上。 – Sachin

@Manu否我在調試器中看不到任何錯誤。 – ebyrock

你混合jQuery和JavaScript語法：

$("show_next_task").onclick這沒有意義。

要麼你使用jQuery（如果你使用jQuery，不要忘記將其添加）：

$("#show_next_task").on("click", function(){ 
// do something here 
});

或者使用JavaScript：

document.getElementById("show_next_task").onclick = function(){ 
// do something here 
}

或者

document.getElementById("show_next_task").addEventListener("click",function(evt){ 
// do something here 
},false);

編輯：

我沒有注意到喲你有一個$函數。

與提琴的問題是實際上的jsfiddle的window.onload =..你不需要它作爲腳本的一部分已經可以在window.onload： http://jsfiddle.net/3486kwtn/8/

來源

2015-09-27 19:33:56 Saar

我編輯了代碼，但仍然無法工作，不知道爲什麼。當我點擊「添加任務」按鈕時，該值不顯示在文本區域以及當我點擊「顯示下一個任務'：（ – ebyrock

因爲你的其他代碼不正確...請看這個小提琴：http://jsfiddle.net/3486kwtn/15/ – Saar

順便說一下，你原來的問題解決了.. – Saar

我不知道這是應該做的正確方法它但它做我需要做的：

//FUNCTION 
      var $ = function (id) { 
       return document.getElementById(id); 
      } 

//ONLOAD EVENT HANDLER 
      window.onload = function() { 
      var taskList = []; 
      var newTask = $("new_task"); 
      var scr = $("task_list"); 
      var nextTask = $("next_task"); 

      $("add_task").onclick = 
       function() { 
        taskList.push(newTask.value); 
        scr.innerHTML = taskList.join("\n"); 
        clear(); 
       } 

       $("show_next_task").onclick = 
        function() { 
        nextTask.value = taskList[0]; 
        taskList.shift(); 
        } 

      function clear() { 
       newTask.value = ""; 

        } 

      }

來源

2015-09-27 21:06:01 ebyrock

JS：在帶有onlick事件的文本框中顯示數組項目？

回答

相關問題