简体   繁体   English

javascript .push() 似乎不起作用

[英]javascript .push() doesn't seem to work

I am trying to use .push to put items into a javascript array.我正在尝试使用 .push 将项目放入 javascript 数组中。 I have created a simplified piece of code.我创建了一段简化的代码。 When I click the button with id clickButton, I am expecting to get a series of alerts with numbers, but I get nothing.当我单击 ID 为 clickButton 的按钮时,我希望收到一系列带有数字的警报,但我什么也没得到。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Sempedia | Making computers think about data the way we do</title>
 <link href="css/styles.css" rel="stylesheet" type="text/css" />
 <script type="text/javascript" src="js/jquery.js"></script>
 <script>
    $(document).ready( function() {
    var myArray = new Array(); //declare the array

    for(var i=0;i<=10;i++){   // create a loop
        myArray.push(i);  // add an item to array
    }

    $("#clickButton").live('click',function() {  //register the button being clicked
    for(var j=0;j<=10;j++){    //for loop
        alert(myArray[j]);   //alert one item in the array
        }
    });

});
 </script>
 </head>
 <body>
 <input type="button" value="click me" id="clickButton" />
 </body>
 </html>

Works for me. 作品对我来说。 You probably have an error elsewhere on the page. 您可能在页面上的其他地方有一个错误。

Here is url to help you reference the jquery library. 这是可帮助您引用jquery库的URL。 http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js

Use valid html, see http://validator.w3.org/ 使用有效的html,请参阅http://validator.w3.org/

Do not include useless comments such as "//for loop" ; 不要包含无用的注释,例如"//for loop" if somebody does not recognize a for loop, that comment is certainly not going to help much. 如果有人不认识for循环,那么该注释肯定不会有太大帮助。 None of those comments are going to be of any help anybody. 这些评论都不会对任何人有任何帮助。

It is important to simplify and remove everything that is unrelated to the problem, such as the link tag. 重要的是简化和删除与问题无关的所有内容,例如link标记。 This will help make it clearer as to what the code is doing. 这将有助于使代码工作更加清晰。

While you're at it, drop jQuery and learn to understand what you are doing. 当您使用它时,放下jQuery并学习了解您在做什么。

The use of jQuery has increased drastically over the past two years. 在过去两年中,jQuery的使用急剧增加。 It is now employed for all sorts of things; 现在,它被用于各种各样的事情。 things that are not only trivial to accomplish without jQuery, but are actually easier to accomplish without jQuery. 不使用jQuery不仅容易完成,而且不使用jQuery实际上更容易完成。 This is often accompanied by complaints that the code does not do what is wanted of it, when all that was required to know why was a very basic understanding of the pertinent technologies. 当所有需要知道为什么对相关技术有非常基本的了解时,通常会伴随着抱怨,即代码无法满足其要求。

Now to your problem. 现在解决您的问题。 You want it to work and it doesn't[1]. 您希望它工作,但不起作用[1]。

The problem you need to solve is to get the event handler to fire. 您需要解决的问题是触发事件处理程序。 If a delegation strategy is desired, such as that you've attempted with jQuery live , then that can be accomplished by adding a click callback on document that inspects the target and handles it, accordingly. 如果需要委托策略,例如您尝试使用jQuery live ,那么可以通过在文档上添加单击回调来检查目标并相应地处理它,从而实现目标。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>Me | Trying to make you think</title>
 <script type="text/javascript">
(function(){
    var myArray = [1,2,3];

    document.onclick = function(ev) {
        var target = getTarget(ev);
        if (target && target.id == "clickButton") {
            handleClickButtonClicked();
        }
    };

    function handleClickButtonClicked() {
        alert(myArray);
    }

    function getTarget(ev) {
        ev = ev || window.event;
        return ev ? ev.target || ev.srcElement : null;
    }
})();
 </script>
 </head>
 <body>
 <p><input type="button" value="click me" id="clickButton"></p>
 </body>
</html>

However, given your level of ability, I would advise going even simpler and just adding an onclick event handler to the button directly. 但是,考虑到您的能力水平,我建议您更简单些,直接在按钮上添加onclick事件处理程序。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>Me | Trying to make you think</title>
 <script type="text/javascript">
    var myArray = [1,2,3];
 </script>
 </head>
 <body>
 <p><input type="button" value="click me" onclick="alert(myArray)" id="clickButton"></p>
 </body>
</html>

[1] http://jibbering.com/faq/notes/posting/#ps1DontWork [1] http://jibbering.com/faq/notes/posting/#ps1DontWork

I have no idea what i did but it sudently started working.same code because i have returned back at start after playing around with diferent posible solutions.我不知道我做了什么,但它突然开始工作。相同的代码,因为我在玩了不同的可能解决方案后又回到了开始。 Coding magic.编码魔法。

I have tried doing this before it started runing, but then i removed [] .我在它开始运行之前尝试过这样做,但后来我删除了 [] 。

    const recipeData = [{
      id: (Math.random() * 100).toString(),
      title: enteredTitle,
      image: enteredImg,
      ingredients: enteredingredients,
      description: enteredDescription,
    }];

Declare myArray outside the scope of the document.ready function. 在document.ready函数的范围之外声明myArray。 For example: 例如:

<script> 
  var myArray = new Array(); //declare the array
  $(document).ready( function() { 

    for(var i=0;i<=10;i++){   // create a loop 
        myArray.push(i);  // add an item to array 
    } 

    $("#clickButton").live('click',function() {  //register the button being clicked 
    for(var j=0;j<=10;j++){    //for loop 
        alert(myArray[j]);   //alert one item in the array 
        } 
    }); 

}); 
 </script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM