2015-10-12 2 views
0

Я довольно новичок в jQuery, поэтому, пожалуйста, пройдите ко мне, потому что я думаю, что это простая ошибка.jQuery не скрывает div, но DOM загружается

У меня есть веб-сайт, на котором показана викторина с несколькими вариантами выбора. Каждый вопрос может иметь от 2 до 4 вариантов. Если пустые опции всегда будут закодированы как «###» в массиве вопросов, поэтому я хотел бы просто скрыть div, содержащий текст «###».

У меня есть следующие (simplfied) HTML макет:

<div class="row" name="row1"> 

<div class="col-xs-12 jumbotron text-center" id="ans1Text" onclick="checkAnswer1()"> 

    Text Goes Here 
</div> 
</div> 


<div class="row" name="row2"> 

<div class="col-xs-12 jumbotron text-center" id="ans2Text" onclick="checkAnswer2()"> 

    Text Goes Here 
</div> 
</div> 


<div class="row" name="row3"> 

<div class="col-xs-12 jumbotron text-center" id="ans3Text" onclick="checkAnswer3()"> 

    Text Goes Here 
</div> 
</div> 


<div class="row" name="row4"> 

<div class="col-xs-12 jumbotron text-center" id="ans4Text" onclick="checkAnswer4()"> 

    Text Goes Here 
</div> 
</div> 

В нижней части страницы, которую я называю:

$(document).ready(function(){ 
         setupQuiz(); 
          }); 

Тогда setupQuiz называет setupQuestion():

function setupQuestion() 
{ 
var r = Math.random(); 

$('#qnum').text(questionNumber.toString() + "/" + (nQuestions-1).toString()); 
$('#timeRemaining').text(timePerQuestion); 


$('#questionText').text(quizquestions[questionNumber-1].q); 
if (r < 0.25){ 
    $('#ans1Text').text(quizquestions[questionNumber-1].correct); 
    $('#ans2Text').text(quizquestions[questionNumber-1].incorrect1); 
    $('#ans3Text').text(quizquestions[questionNumber-1].incorrect2); 
    $('#ans4Text').text(quizquestions[questionNumber-1].incorrect3); 
} 
else if (r>=0.25 && r <0.5){ 
    $('#ans2Text').text(quizquestions[questionNumber-1].correct); 
    $('#ans1Text').text(quizquestions[questionNumber-1].incorrect1); 
    $('#ans4Text').text(quizquestions[questionNumber-1].incorrect2); 
    $('#ans3Text').text(quizquestions[questionNumber-1].incorrect3); 
} 
else if (r>=0.5 && r < 0.75){ 
    $('#ans3Text').text(quizquestions[questionNumber-1].correct); 
    $('#ans4Text').text(quizquestions[questionNumber-1].incorrect1); 
    $('#ans2Text').text(quizquestions[questionNumber-1].incorrect2); 
    $('#ans1Text').text(quizquestions[questionNumber-1].incorrect3); 
} 
else 
{ 
    $('#ans4Text').text(quizquestions[questionNumber-1].correct); 
    $('#ans1Text').text(quizquestions[questionNumber-1].incorrect1); 
    $('#ans2Text').text(quizquestions[questionNumber-1].incorrect2); 
    $('#ans3Text').text(quizquestions[questionNumber-1].incorrect3); 
} 

if ($('#ans1Text').text().indexOf("###") !=-1) 
{ 
    $('#row1').hide(); 
    console.log("1"); 
} 

if ($('#ans2Text').text().indexOf("###") !=-1) 
{ 
    $('#row2').hide(true); 

    console.log("2"); 
} 

if ($('#ans3Text').text().indexOf("###") !=-1) 
{ 
    $('#row3').hide(true); 

    console.log("3"); 
} 

if ($('#ans4Text').text().indexOf("###") !=-1) 
{ 
    $('#row4').hide(true); 

    console.log("4"); 
} 


if(questionTimer != null) 
{ 
    clearInterval(questionTimer); 
    questionTimer = null; 
} 



questionTimer = setInterval(tick, 1000); 

} 

Весь код для установки текста вопроса работает отлично, а консоль регистрирует правильный номер, но правильный div никогда не скрывается! Я потерял это, и я бы очень признателен за любую помощь.

ответ

0

У меня проблема с моим кодом, я не думаю, что он любил использовать $('#row1'), потому что это было только имя, а не идентификатор.

принимая также из аргумент, чтобы скрыть помог, но мне нужно было иметь еще показать его в следующий раз вокруг:

if ($('#ans1Text').text().indexOf("###") !=-1) 
{ 
    $('#ans1Text').hide(); 
    console.log("1"); 
} 
else 
{ 
    $('#ans1Text').show(); 
} 

if ($('#ans2Text').text().indexOf("###") !=-1) 
{ 
    $('#ans2Text').hide();; 

    console.log("2"); 
} 
else 
{ 
    $('#ans2Text').show(); 
} 

if ($('#ans3Text').text().indexOf("###") !=-1) 
{ 
    $('#ans3Text').hide();; 

    console.log("3"); 
} 
else 
{ 
    $('#ans3Text').show(); 
} 

if ($('#ans4Text').text().indexOf("###") !=-1) 
{ 
    $('#ans4Text').hide();; 

    console.log("4"); 
} 
else 
{ 
    $('#ans4Text').show(); 
} 
1

использовать hide() вместо hide (true).

jQuery пытается превратиться в оценку времени для скрытия. Другими словами. он пытается выяснить, как быстро скрыть свой div.

Либо поставить номер там, как 2000 (2 секунды). Или ничего не скрывать(); (Скорость по умолчанию)

0

Может быть, вы можете использовать CSS здесь:

$('#row2').css("display", "none"); 

вместо

$('#row2').hide(true); 
0

Вы должны быть в состоянии назвать только .hide() без прохождения в действительности.

Смежные вопросы