0

需要将 javascript (ajax) 投票脚本转换为可重用(动态)脚本,以便可以反复使用。

我有一些效果很好的 ajax,但我必须重现它并为每个添加的需要投票的问题添加唯一标识符 [您在代码中看到 9 是我必须更改的唯一标识符]。需要使其动态化,以便无论数据库中有多少问题,它都能自行复制或可以与 onclick 标识符一起重复使用。

试图将 javascript 放在 <CFOUTPUT QUERY="GetVotes"> </CFOUTPUT> 标签之间,这样我就可以将 9 更改为 #GetVoteID# 用于投票问题的内容,并在问题重现时动态重现脚本CFOUTPUT。但这不起作用,因为 javascript 中的 #GetVoteID# 导致脚本无法工作,而且我不知道如何使用 onclick 标识符使脚本可重用。

我在许多网站上看到了赞成和反对投票问题,并且这些问题通过数据库输出动态重现,他们在做什么来重用那里的 ajax?

我知道 onclick 标识符是要走的路,所以任何关于如何转换我的脚本、CFC 和其他任何东西的帮助,以便它可以处理需要投票的 10、20 或 1000 个问题。

下面是我的代码(链接、cfajaxproxy、CFC 和 javascript)

是/否链接
<CFOUTPUT QUERY="GetVoteList">
<A HREF="javascript:()" onclick="GetVoteYes9(#GetVoteID#);">Yes</A>
<A HREF="javascript:()" onclick="GetVoteNo9(#GetVoteID#);">No</A>
</CFOUTPUT>

ajax 风格
<STYLE>
GetVoteDescription9{visibility : visible}
</STYLE>

cfajaxproxy
<cfajaxproxy cfc="CFC/GetVoteYes9" jsclassname="YesVote9CFC">
<cfajaxproxy cfc="CFC/GetVoteNo9" jsclassname="NoVote9CFC">

YesVoteCFC

<cfcomponent>
    <cffunction name="NewCount9" access="remote">
        <CFQUERY NAME="YesCount9CK" DATASOURCE="MyDSN">
            SELECT  *
            FROM    GetVote
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">
        </CFQUERY>
        <CFSET NewCount9=#YesCount9CK.YesCount#+1>
        <CFQUERY NAME="UpdateYesCount" DATASOURCE="MyDSN">
            UPDATE  GetVote
            SET     YesCount = <cfqueryparam value="#NewCount9#" cfsqltype="CF_SQL_INTEGER">
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">
        </CFQUERY> 
        <cfreturn NewCount9>
    </cffunction>
</cfcomponent>

NoVoteCFC

<cfcomponent>
    <cffunction name="NewCount9" access="remote">  
        <CFQUERY NAME="NoCount9CK" DATASOURCE="MyDSN">  
            SELECT  *  
            FROM    GetVote   
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">  
        </CFQUERY>  
        <CFSET NewCount9=#NoCount9CK.NoCount#+1>  
        <CFQUERY NAME="UpdateNoCount" DATASOURCE="MyDSN">  
            UPDATE  GetVote  
            SET     NoCount = <cfqueryparam value="#NewCount9#" cfsqltype="CF_SQL_INTEGER">  
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">  
        </CFQUERY>   
        <cfreturn NewCount9>  
    </cffunction> 
</cfcomponent>

ajax 脚本

<SCRIPT TYPE="text/javascript">
    function GetVoteNo9()  
    {   
        var GetVoteNo9 = document.getElementById("GetVoteNo9"); 
        var cfc = new NoCFC9();  
            cfc.setCallbackHandler(getDataResultNo9);  
            cfc.NewCount9(true);  
        var GetVoteDescription9 = document.getElementById("GetVoteDescription9").style.display='none'; 
        var content = document.getElementById('YesResponse9').innerHTML='';
        var content = document.getElementById('NoResponse9').innerHTML='You voted No';
    }  
    function getDataResultNo9(NoResult9)  
    {  
        var content = document.getElementById('NoCount9').innerHTML=NoResult;
    } 

    function GetVoteYes9()  
    {  
        var GetVoteYes9 = document.getElementById("GetVoteYes9"); 
        var cfc = new YesCFC9();  
            cfc.setCallbackHandler(getDataResultYes9);  
            cfc.NewCount9(true);  
        var GetVoteDescription9 = document.getElementById("GetVoteDescription9").style.display='none'; 
        var content = document.getElementById('YesResponse9').innerHTML='You voted Yes';
        var content = document.getElementById('NoResponse9').innerHTML='';
    }  
    function getDataResultYes9(YesResult9)  
    {  
        var content = document.getElementById('YesCount9').innerHTML=YesResult;
    }
</SCRIPT>  
4

1 回答 1

1

这是未经测试的。基本上你需要概括你正在编写的代码。下面的一切都反映了这种方法。

Vote.cfc(取代 YesVoteCFC/NoVoteCFC)

<cfcomponent>
    <cffunction name="NewCount" access="remote">
    <cfargument name="getVoteId">
    <cfargument name="vote">
    <cfset var choice = structNew()>
    <cfset choice.count = 0>
    <cfset choice.vote = arguments.vote>
    <cfargument name="vote">
    <CFQUERY NAME="VoteCount" DATASOURCE="MyDSN">
        SELECT  NoCount, YesCount 
        FROM    GetVote
        WHERE   GetVoteID = <cfqueryparam value="#arguments.voteId#" cfsqltype="CF_SQL_INTEGER">
    </CFQUERY>
    <cfif arguments.vote>
        <CFSET choice.count = VoteCount.YesCount + 1>
    <cfelse>
        <CFSET choice.count = VoteCount.NoCount + 1>
    </cfif>

    <CFQUERY NAME="UpdateYesCount" DATASOURCE="MyDSN">
        UPDATE  GetVote
        SET     <cfif arguments.vote>YesCount<cfelse>NoCount> = <cfqueryparam value="#choice.count#" cfsqltype="CF_SQL_INTEGER">
        WHERE   GetVoteID = <cfqueryparam value="#arguments.voteId#" cfsqltype="CF_SQL_INTEGER">
    </CFQUERY> 
    <cfreturn choice>
</cffunction>

cfajaxproxy

<cfajaxproxy cfc="CFC/Vote" jsclassname="VoteCFC">

是/否链接

<CFOUTPUT QUERY="GetVoteList">
<A HREF="javascript:()" onclick="GetVote('#GetVoteID#', 'Yes');">Yes</A>
<A HREF="javascript:()" onclick="GetVote('#GetVoteID#', 'No');">No</A>
</CFOUTPUT>

ajax 脚本

<SCRIPT TYPE="text/javascript">
    function GetVote(id, vote)  
    {   
        var GetVoteNo9 = document.getElementById("GetVote" + vote + id); 
        var cfc = new VoteCFC();  
            cfc.setCallbackHandler(getDataResult);  
            cfc.NewCount(id, vote);  
        document.getElementById("GetVoteDescription" + id).style.display='none'; 
        document.getElementById('YesResponse' + id).innerHTML= (vote == 'Yes' ? 'You voted Yes' : '');
        document.getElementById('NoResponse' + id).innerHTML= (vote == 'No' ? 'You voted No' : '');
    }  
    function getDataResultNo9(choice)  
    {  
        var content = document.getElementById(choice.vote + 'Count9').innerHTML=choice.count;
    } 

</SCRIPT>
于 2010-10-13T10:47:55.917 回答