多个div的一个按钮

问题描述 投票:0回答:0

我正在尝试创建一个按钮来处理每个帖子的投票系统投票。

基本上,我有一个唯一的按钮集,用于处理页面中每个帖子的所有请求。现在发生的情况是,当我单击该按钮时,会请求与页面中的帖子数量相同的信息。因此,例如:如果我有三个引用用户XYZ的帖子,并且我单击用户Y的帖子按钮,这将为用户X发送3个请求,而不是用户 Y 的一个。所以,简单来说,我的问题是按钮不知道如何区分一篇文章和另一篇文章。

这是我的代码片段:

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://kit.fontawesome.com/fd85e1d44c.js" crossorigin="anonymous"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <style xmlns="http://www.w3.org/1999/html">
        <cfinclude template="../css/menu.css">
        <cfinclude template="../css/login.css">
        <cfinclude template="../css/search.css">
        <cfinclude template="../css/createPost.css">
    </style>
</head>
<body>
<!---
    Create mainPageData() method object used to return all posts
--->
<cfset local.mainData = createObject("component", "index").mainPageData()>

<div class="container">
<cfoutput query="local.mainData">
        <div class="column">
        <cfset local.fetchModelData = createObject("component", "Fanexus.tools.tools").voteOnModelTwo(local.mainData.post_id, local.mainData.post_model_username)>
        <cf_voteOnModel model="#local.fetchModelData.post_model_name#" id="#local.fetchModelData.post_id#" path="./index.cfc">
        </div>
</cfoutput>
</div>
</body>
</html>

这里是 customTag 中 AJAX 的片段。

<cfoutput>
    <button type="button" name="clickBtn" id="clickBtn">CLICK</button>
</cfoutput>

<cfparam name="Attributes.model" default="">
<cfparam name="Attributes.id" default="">
<cfparam name="Attributes.path" default="">

<script language="JavaScript">
    $(document).ready(function() {
        voteOnModel = function() {
            $.ajax({
                url: '<cfoutput>#Attributes.path#</cfoutput>',
                dataType: 'json',
                data: {
                    model_name: '<cfoutput>#Attributes.model#</cfoutput>',
                    method: 'voteOnModel',
                    returnFormat: 'json'
                },
                success: function (data) {
                    console.log(data);
                    alert("YAY " + data[1].text);
                }
            });
        }


        // $("#clickBtn").click(function (){
        $("div.column").click(function (){
            alert('IM HERE');
            voteOnModel();
        });
    });
</script>

如有任何关于如何解决此问题的建议,我们将不胜感激。

javascript jquery ajax cfml
© www.soinside.com 2019 - 2024. All rights reserved.