为什么IF逻辑行不通了呢,请帮我看看这段JS代码

搞了一天了 真的不知道问题出在哪里,这是一个心理测试, 虽然回答选项 都是从 很同意 到 不同意 但是计分 却不一样 有两种 一种是 1分-5分 另一种是5分-1分 但是这个功能死活实现不了。 很奇怪的是判断逻辑是没问题的,执行语句也是没问题的 我试过N遍了 都是不行 都是直接执行ELSE 后面的语句,导致所有回答选项计分都是一样的关键代码我已经框出来了,现在都是很同意到不同意(1-5)分,有些需要5-1分的就实现不了。请大家帮我看看问题出自哪里 第一次碰到这么邪乎的问题

代码贴出来


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />

    <title>心理测验</title>
    <link href="bootstrap.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="style.css" />
    <link href="jquery.mmenu.all.css" rel="stylesheet" />
    <style type="text/css">
        body {
            background: #a5a5a5;
            background-size: 100% auto !important
        }

        body .avatar .img-circle {
            background: #347433 !important
        }

        body form .btn {
            background: #347433 !important;
            border-color: #347433 !important
        }

        #header h1,
        #header p {
            background: none !important
        }
    </style>
    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="bootstrap.min.js"></script>
    <script type="text/javascript" src="jquery.hammer.min.js"></script>
    <script type="text/javascript" src="jquery.mmenu.min.all.js"></script>
    <script src="wxm-core.js"></script>

</head>

<body id="test1" class="test1">
    <div id="content">
        <div id="header_bar">
        </div>
        <!-- E header_bar -->


        <div class="container">
            <div id="header" class="text-center">
                <div style="height: 65px;"></div>

                <div class="container">
                    <div class="text-center header">
                        <h1 class="bold">
                            善爱婚研信任度测评</h1>
                        <p>


                    </div>
                    <!-- E header -->
                    <div id="bd" class="panel">
                        <div id="panel1" class="panel-body">
                            <form action="#">
                                <div class="form-group avatar text-center">
                                    <label for="" class="sr-only">前言</label>
                                    <a href="javascript:void(0)" class="img-circle" name="1"><span style="float: left;text-align: center; width: 100%; padding-top: 18px;">
                                            <img src="ks.jpg"></span> </a>
                                </div>
                                <dl>
                                    <dd>
                                        你们的信任标尺</dd>
                                </dl>
                                <div class="buttons">
                                    <a href="#result" class="btn btn-lg btn-success" style="width: 100%" onclick="return next(0);">
                                        <strong style="color:#fdfd88;">开始测试</strong></a>
                                </div>
                                <div class="buttons" style="margin-top: 10px;">
                                    <a href="" id="weixinfollowlink2" class="btn btn-lg btn-danger" style="width: 100%;">微信关注</strong></a>
                                </div>
                            </form>
                        </div>


                        <!-- 主要的问答界面开始 -->
                        <!-- E panel-body -->
                        <div id="panel2" class="panel-body js_answer" style="display: none;">
                            <form action="#" method="POST">
                                <a name="result" href="javascript:void(0)"></a>
                                <div class="form-group avatar text-center">
                                    <label for="" class="sr-only">
                                        前言</label>
                                    <a href="javascript:void(0)" class="img-circle" name="1" style="position:relative"><span
                                            id="resultscore" style="float: left;
                            text-align: center; width: 100%; padding-top: 0px;"></span>
                                    </a>
                                </div>
                                <dl>
                                    <dd></dd>
                                </dl>
                                <ul class="list-group  js_group">
                                    <li class="list-group-item" onclick="return toggle(this);">
                                        <input name="g" type="radio" value="" />
                                        <span class="QAns"></span></li>
                                    <li class="list-group-item" onclick="return toggle(this);">
                                        <input name="g" type="radio" value="" />
                                        <span class="QAns"></span></li>
                                    <li class="list-group-item" onclick="return toggle(this);">
                                        <input name="g" type="radio" value="" />
                                        <span class="QAns"></span></li>
                                    <li class="list-group-item" onclick="return toggle(this);">
                                        <input name="g" type="radio" value="" />
                                        <span class="QAns"></span></li>
                                    <li class="list-group-item" onclick="return toggle(this);">
                                        <input name="g" type="radio" value="" />
                                        <span class="QAns"></span></li>
                                </ul>
                            </form>
                        </div>









                        <div id="panel3" class="panel-body js_result" data-id="0" style="display: none;">
                            <h1 class="bold text-danger">
                                0~52分</h1>
                            <hr>
                            <dl>
                                <dt>详细分析:</dt>
                                <dd>
                                    <p>
                                        你对伴侣和婚恋关系的信任度较低。不是所有的伴侣都要永远在一起,但
                                        即使是那些受到信任危机困扰的伴侣,如果双方在整个过程中勇于承担自
                                        已的义务,也是可以走出危机的。(在继续阅读本书剩下的部分之前,可
                                        以先阅读第10章。这一章可以帮助你辨别你的伴侣是否值得信任。)独自
                                        阅读本书可以帮你确定自己的处境,可能帮你在和伴侣互动时做出更加积
                                        极的转变。但如果他(她)同意,试着一起来做这些练习。你们都准备好
                                        进行一场寻找心灵之旅了吗?请在读完这本书后再做一次,并将这些建议
                                        付诸行动。如果分数依然很低,你们可以去寻求更多个性化的帮助。</p>
                                </dd>
                            </dl>
                            <div class="buttons">
                                <a href="javascript:void(0)" class="btn btn-lg btn-success" style="width: 100%" onclick="$('#mcover').show()">
                                    分享给其他小伙伴</a>
                            </div>
                        </div>
                        <div id="panel3" class="panel-body js_result" data-id="1" style="display: none;">
                            <h1 class="bold text-danger">
                                53~105分</h1>
                            <hr>
                            <dl>
                                <dt>详细分析:</dt>
                                <dd>
                                    <p>
                                        你们之间的信任属于中等水平。你对伴侣忠诚——但并不确定。你可以通
                                        过书中的练习来巩固你们的关系。尽管最佳方式是你们一起完成练习,但
                                        即使是你独自完成,这些练习也会对你们的关系有所裨益。当你们中的一
                                        个人更加清楚自己的需求和渴望时,你们就会更加关注这些方面,也更容
                                        易做出积极的转变。如果你们的信任标尺没有进步,反思一下你们两人是
                                        否都把婚恋关系放到了首要位置。如果你们的信任标尺提高了,这充分说
                                        明你们彼此更加心灵相通、幸福快乐,你们之间的关系也更令人满意。</p>
                                </dd>
                            </dl>
                            <div class="buttons">
                                <a href="javascript:void(0)" class="btn btn-lg btn-success" style="width: 100%" onclick="$('#mcover').show()">
                                    分享给其他小伙伴</a>
                            </div>
                        </div>
                        <div id="panel3" class="panel-body js_result" data-id="1" style="display: none;">
                            <h1 class="bold text-danger">
                                106~210分</h1>
                            <hr>
                            <dl>
                                <dt>详细分析:</dt>
                                <dd>
                                    <p>
                                        你对伴侣深信不疑。这样坚定的基础增加了你们白头偕老的可能性。如果
                                        你处在这一分数区间的下游,你们仍然有必要就关系问题好好谈谈。如果
                                        你的信任水平非常高,这本书仍然对你有用。想想你们在一起读书,这本
                                        身就是一件浪漫的事,还会让你们更加确信对彼此的爱,而且会教你们如
                                        何维持现状。</p>
                                </dd>
                            </dl>
                            <div class="buttons">
                                <a href="javascript:void(0)" class="btn btn-lg btn-success" style="width: 100%" onclick="$('#mcover').show()">
                                    分享给其他小伙伴</a>
                            </div>
                        </div>
                    </div>
                    <!-- E container -->
                    <input type="hidden" name="totalsc" id="totalsc" value="0" />
                    <script type="text/javascript">
                        var total = 42;
                        var scoreArr = new Array();
                        scoreArr[0] = new Array();
                        scoreArr[0]['min'] = 0;
                        scoreArr[0]['max'] = 52;
                        scoreArr[1] = new Array();
                        scoreArr[1]['min'] = 53;
                        scoreArr[1]['max'] = 105;
                        scoreArr[2] = new Array();
                        scoreArr[2]['min'] = 106;
                        scoreArr[2]['max'] = 210;
                        var tScore = 0;



                        //集中添加问题及选项

                        var QArr = new Array(parseInt(total));
                        //集中添加问题
                        QArr[0] = "1.我感到被伴侣保护。";
                        QArr[1] = "2.我的伴侣对我忠诚。";
                        QArr[2] = "3.我的伴侣在经济上支持我。";
                        QArr[3] = "4.在伴侣身边我有时会感到不适。";
                        QArr[4] = "5.我不认为伴侣和他人存在亲密关系。";
                        QArr[5] = "6.从现在开始,我的伴侣不会和除我以外的人生育孩子。";
                        QArr[6] = "7.我的伴侣全心全意地爱着我们的孩子,或者至少尊重我自己的";
                        QArr[7] = "8.我相信大多数人是可信的。";
                        QArr[8] = "9.我的伴侣让我有安全感。";
                        QArr[9] = "10.我知道我的伴侣永远都是我非常亲密的朋友。";
                        QArr[10] = "11.我的伴侣会尽到共同抚养孩子的义务。";
                        QArr[11] = "12.关键时刻,我可以指望我的伴侣为我和家庭作出牺牲。";
                        QArr[12] = "13.我的伴侣会做家务。";
                        QArr[13] = "14.我的伴侣为提高家庭经济安全而努力工作。";
                        QArr[14] = "15.我的伴侣不尊重我。";
                        QArr[15] = "16.我的伴侣让我觉得自己性感撩人。";
                        QArr[16] = "17.我的伴侣在做决定时总是考虑我的感受。";
                        QArr[17] = "18.我知道我的伴侣会在我生病时照顾我。";
                        QArr[18] = "19.当我们相处不融洽时,我的伴信会和我协作处理我们之间的关系。";
                        QArr[19] = "20.我的伴侣会给我情绪上的陪伴。";
                        QArr[20] = "21.我的伴侣不过度饮酒和使用药物。";
                        QArr[21] = "22.我的伴侣会对我作浪漫的表示。";
                        QArr[22] = "23.我的伴侣对我的家人很照顾。";
                        QArr[23] = "24.伤心或愤怒时,我可以信任伴侣对我说的话。";
                        QArr[24] = "25.我的伴侣轻视或者羞辱我。";
                        QArr[25] = "26.我的伴侣总是先想到别人,而不是我。";
                        QArr[26] = "27.我的伴侣会和我一起工作,在经济方面共同进退。";
                        QArr[27] = "28.我在婚恋关系中有权力和影响力。";
                        QArr[28] = "29.我的伴侣会向他人展示他(她)有多珍惜我。";
                        QArr[29] = "30.我的伴侣帮我照顾孩子。";
                        QArr[30] = "31.我就是不能完全信任我的伴侣。";
                        QArr[31] = "32.我的伴侣信守承诺。";
                        QArr[32] = "33.我的伴侣是个品行端正的人。";
                        QArr[33] = "34.我的伴侣会做他(她)答应做的事。";
                        QArr[34] = "35.我的伴侣会背叛我的信任。";
                        QArr[35] = "36.我的伴侣对我深情款款。";
                        QArr[36] = "37.在争论时,我可以相信我的伴侣是真的在听我说话。";
                        QArr[37] = "38.我的伴侣能够分享我的梦想,并以此为荣。";
                        QArr[38] = "39.我害怕我的伴侣出轨。";
                        QArr[39] = "40.我的伴侣的言谈举止都反映了我们共同的价值观。";
                        QArr[40] = "41.我的伴侣经常和我做爱。";
                        QArr[41] = "42.我不能依靠伴侣和我一起建立或维持家庭的感觉。";


                        //集中添加回答
                        var QAnn = 5;
                        var QAns = new Array(QAnn);
                        QAns[0] = "A.很同意";
                        QAns[1] = "B.同意";
                        QAns[2] = "C.中立";
                        QAns[3] = "D.不同意";
                        QAns[4] = "E.很不同意";

                        //集中添加分数排序
                        var QAnon = 2; //两种计分类型,一种正序,一种反序。
                        var QAno = new Array();
                        QAno[0] = [1, 2, 3, 4, 5];
                        QAno[1] = [5, 4, 3, 2, 1];

                        //集中将分数进行初始化
                        //参考对照序列[正序]
                        var referSn = new Array();
                        referSn = [4, 15, 25, 26, 31, 39];




                        var QAnor = false;
                        for (var i = 0; i < QArr.length; i++) {
                            //集中添加选题界面
                            if (i <= QArr.length - 1) {
                                $("#panel2").after($("#panel2").clone());
                            }

                            //求正序或者倒序
                            if (referSn.indexOf(i + 1) != -1) {
                                QAnor = true;
                            } else {
                                QAnor = false;
                            }

                            **

> //自动为各项添加分值
>                             if (QAnor == true) {
>                                 
>                                 for (var j = 0; j < QAno[0].length; j++) {
>                                     $("div.js_answer").eq(i).find("input[name='g']").eq(j).val(QAno[0][j]);
>                                 }
>                             } else {
>                                 
>                                 for (var j = 0; j < QAno[1].length; j++) {
>                                     $("div.js_answer").eq(i).find("input[name='g']").eq(j).val(QAno[1][j]);
>                                 }
>                             }

**



                        }





                        function next(t, score) {
                            // console.log(t);
                            $("div#bd > div.panel-body").hide();
                            $("div.js_answer").eq(t).show();

                            //自动加分数和动态加分显示
                            var cEle = $(
                                "<span id = \"upscore\" style=\"color:white; font-size:15px;position:absolute;left:90%;top:0px;\">+" +
                                score + "</span>");
                            // console.log(cEle);
                            $("div.js_answer").eq(t).find("#resultscore").after(cEle);
                            $("div.js_answer").stop().eq(t).find("#upscore").animate({
                                top: '-100px',
                                opacity: '0'
                            }, 1500);
                            $("div.js_answer").eq(t).find("#resultscore").html($("#totalsc").val());
                            //自动添加问题项
                            $("div.js_answer").eq(t).find("dd").html(QArr[t]);
                            //自动添加回答项
                            for (var i = 0; i < QAns.length; i++) {
                                $("div.js_answer").eq(t).find(".QAns").eq(i).text(QAns[i]);

                            }
                            gotoTop();
                        }

                        function result(t) {
                            // share_pop("open", 10000);
                            $("div#bd > div.panel-body").hide();
                            for (var i = 0; i < parseInt(scoreArr.length); i++) {
                                if (parseInt(t) >= parseInt(scoreArr[i]['min']) && parseInt(t) <= parseInt(
                                        scoreArr[i][
                                            'max'
                                        ])) {
                                    $("div.js_result").eq(i).show();
                                    // $("div.js_result").eq(i).find(".resultscore").eq(0).html($("#totalsc").val());
                                    gotoTop();
                                } else
                                    continue;
                            }
                        }
                        //累计加值,判断当前第几题 如果到最后了就直接显示结果,如果未到直接跳入下一题,
                        var jieliu = true;

                        function toggle(t) {
                            if (jieliu) {
                                jieliu = false;
                                $(t).children("input").attr("checked", "checked");
                                $("li.list-group-item").removeClass('active');
                                var score = $(t).children("input:checked").val();
                                tScore = parseInt(tScore) + parseInt(score);
                                $("#totalsc").val(tScore);
                                $(t).addClass('active');
                                var t = $("div.js_answer").index($(t).parents("div.js_answer")) + 1;
                                // console.log(t);
                                if (t >= total) {
                                    result(tScore);
                                } else {
                                    setTimeout(function () {

                                        next(t, score);
                                    }, 300);
                                }
                                //定时器
                                setTimeout(function () {
                                    jieliu = true;
                                }, 500);
                            }
                        }

                        function gotoTop() {
                            $("body,html").animate({
                                scrollTop: ($("#header").offset().top + $("#header").height())
                            }, 0);
                        }
                    </script>
                </div>



                <!-- 分享朋友圈及好友代码 -->
                <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
                <script>
                    /*
                     * 注意:
                     * 1. 所有的JS接口只能在公众号绑定的域名下调用,公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
                     * 2. 如果发现在 Android 不能分享自定义内容,请到官网下载最新的包覆盖安装,Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
                     * 3. 常见问题及完整 JS-SDK 文档地址:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
                     *
                     * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决,如仍未能解决可通过以下渠道反馈:
                     * 邮箱地址:weixin-open@qq.com
                     * 邮件主题:【微信JS-SDK反馈】具体问题
                     * 邮件内容说明:用简明的语言描述问题所在,并交代清楚遇到该问题的场景,可附上截屏图片,微信团队会尽快处理你的反馈。
                     */
                    wx.config({
                        debug: false,
                        appId: '<?php echo $signPackage["appId"]; ?>',
                        timestamp: <?php echo $signPackage["timestamp"]; ?>,
                        nonceStr: '<?php echo $signPackage["nonceStr"]; ?>',
                        signature: '<?php echo $signPackage["signature"]; ?>',
                        jsApiList: ['checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage',
                            'onMenuShareQQ', 'onMenuShareWeibo', 'showOptionMenu', 'hideMenuItems',
                            'onMenuShareQZone'
                        ]
                    });


                    wx.ready(function () { //需在用户可能点击分享按钮前就先调用
                        //分享朋友圈
                        wx.onMenuShareTimeline({
                            title: '善爱婚研信任度评测',
                            link: 'http://www.tingxinyuan.com/ts/index.php',
                            desc: '你想知道的,都在这里', // 分享描述
                            imgUrl: 'http://www.tingxinyuan.com/logooooo.jpg', // 自定义图标
                            success: function () {
                                shareSuccess();
                            }

                        });
                        //分享给好友
                        wx.onMenuShareAppMessage({
                            title: '善爱婚研信任度评测',
                            link: 'http://www.tingxinyuan.com/ts/index.php',
                            desc: '你想知道的,都在这里', // 分享描述
                            imgUrl: 'http://www.tingxinyuan.com/logooooo.jpg', // 自定义图标
                            success: function () {
                                shareSuccess();
                            }
                        });
                    });
                </script>

                <script type="text/javascript">
                    //点击选项时变色代码
                    $(function () {
                        $("input[name='g']").change(function () {
                            $("li.list-group-item").removeClass('active')
                            $(this).parent("li.list-group-item").addClass('active');
                        });
                    });
                </script>


                <!-- 分享指导代码 -->

                <div id="mcover" onclick="document.getElementById('mcover').style.display='';" style="display: none;"><img
                        src="guide.png"></div>




                <div id="pop_success" class="text-center" style="display: none;">
                    <div class="bd text-center">
                        <p style="line-height: 110px;">
                            分享成功</p>
                    </div>
                    <!-- E bd -->
                </div>
                <!-- E pop_success -->
                <div id="popup-1" class="tip" style="display: none;">
                    <div>
                        <a id="close1" href="javascript:void(0)"><i class="glyphicon glyphicon-remove"></i>
                        </a>
                        <div class="row text-center">
                            <a href="javascript:;" class="btn btn-danger col-sm-12 btn-lg" id="weixinfollowlink">微信关注:野海潮</a>
                        </div>
                        <!-- E discuss -->
                    </div>
                </div>
                <!-- E tip -->
                <div id="follow" class="well" style="display: none;">
                    <a id="close1" href="javascript:void(0)">X</a>
                    <div class="row text-center">
                        <a href="javascript:;" class="btn btn-danger col-sm-12 btn-lg" id="weixinfollowlink1">微信关注:野海潮</a>
                    </div>
                    <!-- E row -->
                </div>

                <script>
                    $(function () {
                        $("a#close1").click(function () {
                            share_pop("close", 0);
                        });
                        if (navigator.userAgent.indexOf("MicroMessenger")) {
                            $("#weixinfollowlink").attr("href",
                                "https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzI0NzQyNDY2Nw==&scene=126#wechat_redirect"
                            );
                            $("#weixinfollowlink1").attr("href",
                                "https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzI0NzQyNDY2Nw==&scene=126#wechat_redirect"
                            );
                            $("#weixinfollowlink2").attr("href",
                                "https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzI0NzQyNDY2Nw==&scene=126#wechat_redirect"
                            );

                        }
                    });

                    function shareSuccess() {
                        $("div#pop_success").show().delay(1500).fadeOut("slow");
                    }
                </script>

                <div id="copy">
                    <p class="text-center">
                        &copy; <a href="http://tingxinyuan.com" target="_blank">听心苑心理</a>
                    </p>
                </div>
                <!-- E copy -->
                <div id="share_tips" class="sr-only">
                    <div class="container text-right">
                        点击右上角,分享给朋友/朋友圈 <i class="glyphicon glyphicon-hand-up element-animation"></i>
                    </div>
                    <!-- E container -->
                </div>
</body>

</html>

大家还可以直接访问我的站的地址 http://www.tingxinyuan.com/ts/

问题描述

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方(请勿用图片代替代码)

你期待的结果是什么?实际看到的错误信息又是什么?

阅读 2.7k
2 个回答

关键问题出在这一句.

$("#panel2").after($("#panel2").clone());

$('#panel2') 每次都会选中第一个 id 为 panel2 的元素. 所以你每次都是在第一个元素后面出入新的元素, 导致除第一个元素以外的所有元素每次循环都往后位移了一个位置, 这样其实你每次循环的时候 i 都指向同一个元素. 在不改变 html 的情况下, 解决方案如下.

var $last = $("#panel2");
for (var i = 0; i < QArr.length; i++) {
  //集中添加选题界面
  if (i <= QArr.length - 1) {
    var $clone = $last.clone();
    $last.after($clone);
    $last = $clone;
  }

  //求正序或者倒序
  if (referSn.indexOf(i + 1) != -1) {
    QAnor = true;
  } else {
    QAnor = false;
  }

  //自动为各项添加分值
  if (QAnor == true) {
    // alert('true');
    add(i, QAno[1]);
  } else {
    // alert('false');
    add(i, QAno[0]);
    // for (var j = 0; j < QAno[0].length; j++) {
    // $("div.js_answer").eq(i).find("input[name='g']").eq(j).val(QAno[0][j]);
    // }

  }

}

ps: 建议用 class 而不是 id.

真的是大神,非常感谢 ,我还担心 代码比较繁复冗杂,没描述清楚,没想到您能直接找出逻辑问题所在。再次感谢

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题