2016-08-08 2 views
0

так что я пытаюсь сделать, чтобы оператор if/else в функции ниже проверялся каждый раз, когда вызывается функция. Я называю это с помощьюКак сделать проверку if/else проверкой каждый раз, когда вызывается моя функция (JavaScript)?

OnClick = "openNav()"

в моем HTML. Большое вам спасибо за вашу помощь, извините, если это хромой вопрос, поскольку я новичок в JavaScript.

код ниже:

var intViewportWidth = window.innerWidth; 
 

 
function openNav() { 
 

 
\t $("body").css("background-color", "rgba(0,0,0,.4)"); 
 

 
\t if (intViewportWidth < 1200) { 
 

 
\t \t $("header nav").css("width", "100%"); 
 
\t \t $("body").css("margin-right", "100%"); \t 
 

 
\t } 
 
\t else { 
 

 
\t \t $("header nav").css("width", "30%"); 
 
\t \t elBody.css("margin-right", "30%"); 
 

 
\t } 
 

 
\t $("#hamburger").hide(); 
 

 
}

+0

Попробуйте переместить 'вар intViewportWidth = window.innerWidth;' внутри вашей функции. – SimianAngel

+0

Он работает, спасибо. :) –

+0

Несомненно! Когда вы вызываете 'openNav()' используя 'onclick', ваша функция не имеет представления о том, что представляет' intViewportWidth'. Вероятно, ваш браузер выбрал опорную ошибку, потому что переменная не определена, и ваша условная логика никогда не достигается. Вероятно, вы хотите оценить ширину окна всякий раз, когда вы вызываете эту функцию в любом случае, чтобы ваш навигатор мог отвечать на соответствующие стили. – SimianAngel

ответ

1

Используйте ниже фрагмент кода. Если значение ширины внутри функции не установлено, intViewportWidth не изменится.

function openNav() { 
 
    
 
\t $("body").css("background-color", "rgba(0,0,0,.4)"); 
 
    
 
    var intViewportWidth = window.innerWidth; 
 
\t if (intViewportWidth < 1200) { 
 

 
\t \t $("header nav").css("width", "100%"); 
 
\t \t $("body").css("margin-right", "100%"); \t 
 

 
\t } 
 
\t else { 
 

 
\t \t $("header nav").css("width", "30%"); 
 
\t \t elBody.css("margin-right", "30%"); 
 

 
\t } 
 

 
\t $("#hamburger").hide(); 
 

 
}

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