jQuery click事件在段落標記前加兩次

Question

我有一個click事件，該事件在一個段落標記之前兩次添加到一個元素，但我不明白為什么。 誰能給我一個理由？ jQuery的

function select_menu(){
    var select = $(".select");
    var option_menu = $(".option-menu");
    var option = $(".option");
    select.on("click", function(){
        $(this).find(option_menu).toggle();
        select = $(this);
        $(this).find(option_menu).each(function(){
            $(".current").hide();
            if($(this).hasClass("current")){
                $(this).removeClass("current");
            }
            else{
                $(this).show().addClass("current");
            }
        })
    })

    option.on("click", function(){
        select.children("p").remove();
        var value = $(this).text();
        select.prepend("<p><input type='hidden' name='center' id='center' value='" +value +"' />" +value +"<p>");
    })

    $(document).on("click", function(ev){
        if($(ev.target).closest(".select").length === 0){
            $(".current").hide().removeClass("current");
        }
    })
}

這是腳本在其前面添加段落標記的區域。 的HTML

<fieldset for="center">
    <label>Center:</label>
    <div class="select" name="center_menu" id="center_menu">
        <div class="arrow"></div>
        <div class="option-menu">
            <?php
                $query = "SELECT * FROM $centers";
                $result = mysqli_query($connect, $query);
                global $center_name;
                while($row = mysqli_fetch_assoc($result)){
                    $center_name = "{$row['center']}";
                    echo "<div class='option'>" .$center_name ."</div>";
                }
           ?>
       </div>
    </div>
</fieldset>

Answer 1

在您的代碼中：

select.prepend("<p><input type='hidden' name='center' id='center' value='" +value +"' />" +value +"<p>");

您以相同的方式打開和關閉段落標簽。 應該有一個結束標簽。

該頁面將其識別為兩個單獨的段落標簽，並自動將其關閉。 可能會解決您的問題。