当我从foreach列表中单击按钮时,如何激活它,仅激活该特定列表中的按钮?

时间:2018-09-26 11:24:57

标签: javascript jquery

因此,我有一些按钮可以切换一些可以在其中发送消息的输入文本区域,如何做到这一点,所以当我单击特定列表中的按钮时,它只会激活该特定列表中的按钮。

我尝试了很多其他事情,但是我真的不知道如何克服它。 我是JS的新手,主要是Java。

function showFeedback (list) {
var lines = "";
var counter = 0;
list.forEach(function (obiect) {
    $(document).ready(function(){
        $("button").click(function(){
            $("#div"+ obiect.idfeedback +"").fadeToggle("slow");
        });
    });
    counter++;
    var style = "";
    if(obiect.feedbackType == 1){
        style = "style=\"background: green;\"";
    } else if(obiect.feedbackType == 0){
        style = "style=\"background: red;\"";
    }

    lines += `<div class="page-block"><div style="text-align: right"><a href="feedback?action=delete&idfeedback=`+obiect.idfeedback+`">X</a></div><div class="cv-block" ${style} >
    <div id="parent_div_1">
        Name: ${obiect.firstn}
        ${obiect.lastn}
    </div>

    <div id="parent_div_2" style="float: right">
        Date: ${obiect.date}
    </div>
    <div class="message_div"><p>${obiect.message}</p></div>
</div>
<button>Contact</button>
<div id="div`+ obiect.idfeedback +`" style="display: none">
  <form action="contact" method="post">
    <textarea name="message" id="umessage" cols="30" rows="10" maxlength="450" placeholder="Type your message here..." style="height:115px;width: 620px"></textarea>
    <input type="hidden" name="email" id="umail" value="`+obiect.email+`">
    <input type="hidden" name="action" value="feedback">
    <div><input type="submit" value="Send Email"></div>
  </form>
</div>
</div>`;
}); if(counter==0){
    lines+= `<div class="page-block">No feedbacks to review.</div>`;
}
$("#obiect").html(lines);}

1 个答案:

答案 0 :(得分:0)

摆脱$(document).ready,它用于确保在分配事件之前已加载标记。在您的情况下,标记是动态生成的,加上document.read循环内没有意义。

修复此代码的最简单方法是将$('button')移到循环外。循环后,执行以下操作

$('button').click(function(){
    $(this).next().fadeToggle("slow");
})

此代码的作用是在每个button元素的click事件上添加一个处理程序,当单击按钮时,它将找到放置在next到button元素中的元素,在您的情况下是必需的div元素,并显示该元素。