一些Jquery中的错误

时间:2016-02-24 15:00:01

标签: javascript jquery html xslt

我有一个通过xsl样式表显示的调查。我有一个部分检查用户是否选择"两者都没有"对于多个选项,如果是,则显示另一个问题。

这是JQuery:

function block3Check(){
    var neither23 = $('input[name=response23]:checked', '#editForm').val();
    var neither24 = $('input[name=response24]:checked', '#editForm').val();
    var neither25 = $('input[name=response25]:checked', '#editForm').val();
    var neither26 = $('input[name=response26]:checked', '#editForm').val();

    if(neither23 && neither24 && neither25 && neither26 == 'Neither')
    {

        $('#question-27').slideDown(500);
        $('#after-link').hide();
    }
}

我没有收到有关此代码的错误或警告,但我认为该错误存在于我的IF语句或我的XSL代码中。如果所有选项都没有被选中,则新问题应该向下滑动,但是如果选择了4个中的3个,则当前会这样做。

XSL:

<xsl:when test="../@id='23'">
    <div class="block3Glory hidden">
        <hr /><p><br /></p>
        <div id="question-23">
            <strong>Suppose you were considering <u>only the following two</u> study abroad programs. Which, if either, would you be more likely to choose?<br /></strong>
            <p></p>
            <table><tr><td><img src="survey/study_abroad/b3q1-programA.jpg" /></td><td><input name="response23" value="Program-A" type="radio" />Program A</td></tr></table>
            <table><tr><td><img src="survey/study_abroad/b3q1-programB.jpg" /></td><td><input name="response23" value="Program-B" type="radio" />Program B</td></tr></table>
            <table style="padding-top: 8px;"><tr><td style="border-top: 1px solid #000; width: 600px; text-align: center;"><b>I would choose neither</b></td><td style="padding-left: 10px;"><input name="response23" value="Neither" type="radio" onclick="block3Check()"/>Neither<br /></td></tr></table>
            <p><br /></p>
        </div>
    </div>
    </xsl:when>
    <xsl:when test="../@id='24'">
    <div class="block3Glory hidden">
        <hr /><p><br /></p>
        <div id="question-24">
            <strong>Now suppose <u>instead</u> that you were considering <u>only the following two</u> study abroad programs. Which, if either, would you be more likely to choose?<br /></strong>
            <p></p>
            <table><tr><td><img src="survey/study_abroad/b3q2-programA.jpg" /></td><td><input name="response24" value="Program-A" type="radio" />Program A</td></tr></table>
            <table><tr><td><img src="survey/study_abroad/b3q2-programB.jpg" /></td><td><input name="response24" value="Program-B" type="radio" />Program B</td></tr></table>
            <table style="padding-top: 8px;"><tr><td style="border-top: 1px solid #000; width: 600px; text-align: center;"><b>I would choose neither</b></td><td style="padding-left: 10px;"><input name="response24" value="Neither" type="radio" onclick="block3Check()"/>Neither<br /></td></tr></table>
            <p><br /></p>
        </div>
    </div>
    </xsl:when>
    <xsl:when test="../@id='25'">
    <div class="block3Glory hidden">
    <hr /><p><br /></p>
        <div id="question-25">
            <strong>Now suppose <u>instead</u> that you were considering <u>only the following two</u> study abroad programs. Which, if either, would you be more likely to choose?<br /></strong>
            <p></p>
            <table><tr><td><img src="survey/study_abroad/b3q3-programA.jpg" /></td><td><input name="response25" value="Program-A" type="radio" />Program A</td></tr></table>
            <table><tr><td><img src="survey/study_abroad/b3q3-programB.jpg" /></td><td><input name="response25" value="Program-B" type="radio" />Program B</td></tr></table>
            <table style="padding-top: 8px;"><tr><td style="border-top: 1px solid #000; width: 600px; text-align: center;"><b>I would choose neither</b></td><td style="padding-left: 10px;"><input name="response25" value="Neither" type="radio" onclick="block3Check()"/>Neither<br /></td></tr></table>
            <p><br /></p>
        </div>
    </div>
    </xsl:when>
    <xsl:when test="../@id='26'">
    <div class="block3Glory hidden">
    <hr /><p><br /></p>
        <div id="question-26">
            <strong>Now suppose <u>instead</u> that you were considering <u>only the following two</u> study abroad programs. Which, if either, would you be more likely to choose?<br /></strong>
            <p></p>
            <table><tr><td><img src="survey/study_abroad/b3q4-programA.jpg" /></td><td><input name="response26" value="Program-A" type="radio" />Program A</td></tr></table>
            <table><tr><td><img src="survey/study_abroad/b3q4-programB.jpg" /></td><td><input name="response26" value="Program-B" type="radio" />Program B</td></tr></table>
            <table style="padding-top: 8px;"><tr><td style="border-top: 1px solid #000; width: 600px; text-align: center;"><b>I would choose neither</b></td><td style="padding-left: 10px;"><input name="response26" value="Neither" type="radio" onclick="block3Check()"/>Neither<br /></td></tr></table>
            <p><br /><a id="after-link" href="javascript:" onclick="showAfterBlock()">Continue</a></p>
        </div>
    </div>
</xsl:when>

任何帮助都将不胜感激。

2 个答案:

答案 0 :(得分:1)

您的if语句始终为false。你应该检查所有变量的'Neither'值,如下所示:

 if(neither23 == 'Neither' && neither24 == 'Neither' && neither25 == 'Neither' && neither26 == 'Neither') {
     $('#question-27').slideDown(500);
     $('#after-link').hide();
 }

答案 1 :(得分:1)

if(neither23 && neither24 && neither25 && neither26 == 'Neither') 如果你想检查所有等于Neither,那那就错了。

您可以使用Array.prototype.every()(使用polyfill支持旧浏览器):

if([neither23,neither24,neither25,neither26].every(function(elm){ return elm === 'Neither';})) {
  $('#question-27').slideDown(500);
  $('#after-link').hide();
}