Question

我在php中开发了一个问答网站，我想在按下按钮时打印答案评论。一切都像魅力一样，但只在第一个按钮上。我知道为什么这不起作用，我想它只考虑了它找到的第一个id。

所以，我的问题是，有没有办法根据ID来命名我想调用的元素？例如：

<button class="btn icon-chat" title="Add a comment on this answer"
                        type="button" id="showarea . {answer['answerid']"} name="showarea" value="Show Textarea">
                    Comment</button>
<div id="textarea">
                    {include file="comment_form.tpl"}
                </div>

但是我如何在我的JS函数上调用这个PHP变量？

$("#textarea, #textarea-ok").hide(); // or you can have hidden w/ CSS
$("#showarea").click(function(){
    $("#textarea").show();
});
$("#textarea-ok, #cancel").click(function(){
    $("#textarea").hide();
});

这是最好的方法吗？有关JS代码的任何建议吗？

亲切的问候

Answer 1

实时方法应该没问题

$("body").on("click", ".myClass", function(){
    // do it again // or #myId
});

不要忘记带有Id选择器的事件只能在一个元素上，并且每个元素都有一个类......

使用示例编辑

<div class="post-button clearfix">
    // i changed this button as well
    <button class="btn icon-chat show-textarea" title="Add a comment on this answer" type="button" data-answer="{$answer['publicationid']}">Comment</button>

    <div class="textarea">
        {include file="comment_form.tpl"}
    </div>
</div>


// comment_form.tpl

// i added a master container
<div class="comment-form">
    <form method="post" action="{$BASE_URL}controller/actions/comments/create_comment.php">
        <textarea name="comment" rows="4" cols="40" class="qa-form-tall-text"></textarea>

        // i deleted the wrong input here
        <input type="hidden" name="answerid" value="{$answer['answerid']}" />
        <input type="hidden" name="questionid" value="{$question['publicationid']}" />

        // i changed these 2 buttons as well
        <button type="button" class="textarea-cancel qa-form-tall-button qa-form-tall-button-comment">Cancel</button>
        <button type="submit" class="textarea-ok">Ok</button>
    </form>
</div>

然后使用选择器中的类更改脚本，如：

...

$('.comment-form').hide();

$("body").on("click", ".show-textarea", function(){
    $('.comment-form').show();
});

$("body").on("click", ".textarea-ok, .textarea-cancel", function(){
    $('.comment-form').hide();
});

....

有关Jquery Selector的更多信息：https://www.w3schools.com/jquery/jquery_ref_selectors.asp

有关live method wit .on（）的更多信息： https://www.w3schools.com/jquery/event_on.asp

有关Html表单的更多信息 https://www.w3schools.com/html/html_forms.asp

阅读这些文档以便自己好;）

Javascript函数仅适用于第一次调用

1 个答案: