Question

所以列表有效！现在为我的下一个技巧。我希望用户能够根据需要多次对这些列出的电影进行投票，当他们投票时，我希望这些投票电影能够安排在“你是最好的电影”下面的列表中。这是我到目前为止所得到的：

HTML中的

：

<!DOCTYPE html>
<html>
<link rel="stylesheet" text="text/css" href="movies.css">
  <head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>

<title> 
Hello World 
    </title>
  </head>
  <body>
    <h1>My Favorite Movies</h1>
        <div id = "first">
            <input type="text" id="movie" placeholder="Movie">
            <button id="enter">Enter</button>
        </div>
    <div id="list"><u>Chosen Films:</u></div>
    <!-- <div>Chosen Films: <span id="list"></span></div> -->
    <!-- <div id="films"></div> -->
    <div id="best">You're Best Films:</div>



<script type="text/javascript" src="movies.js"></script>
  </body>
</html>

和我的js：

/ The function that creates the first list
$("#enter").click(
  function() {
    var movie = $("#movie").val();
    var list = (movie);
    $('#list').append('<p>' + '<button id="vote"></button>' + list + '</p>');
  });

// The function that is supposed to place the chosen movies in a list below "Your best films"
$("#vote").click(
    function() {
    var voted = $("#best").val();
    var best = (voted);
    $('#best').append('<p>' + list + '</p>');
    });

所以第一个功能起作用，只需要第二个功能。

Answer 1

首先，你不能从第二个函数中调用list。它超出了范围。所以你需要存储它或传递它。我建议将它存储在按钮的值中。

工作小提琴：http://jsfiddle.net/Twisty/810353L9/

<强> JQUERY

// The function that creates the first list
$("#enter").click(function () {
    var movie = $("#movie").val();
    var $btn = $('<button />', {
        id: "vote",
        type: "button",
        text: "^",
        value: movie,
        click: function(){
            var vote = this.value;
            $("#best").append('<p>'+vote+'</p>');
        }
    });
    var $p = $('<p />');
    //$('#list').append('<p>' + '<button id="vote" value="'+list+'">Vote</button> '+list+'</p>');
    $p.append($btn, " ", movie);
    $p.appendTo("#list");
});

// The function that is supposed to place the chosen movies in a list below "Your best films"
/*$("#vote").live('click', function () {
    var voted = $(this).attr("value");
    console.log(voted);
    $('#best').append('<p>' + voted + '</p>');
});*/

这会创建投票按钮，投票按钮会附加下一个列表。

能够投票和安排投票

1 个答案: