Window.open с проверкой того же содержимого div
Я хочу создать всплывающее окно со следующим:
- Открывать всплывающее окно, когда пользователь нажимает на div 1, показывая содержимое div 1.
- Если содержимое div 1 уже существует во всплывающем окне, и пользователь нажимает на div 1, ничего не делать
- Когда пользователь щелкает div 2, очищается всплывающее окно и отображается содержимое div 2.
Я пробовал следующее, но условный оператор всегда верен, потому что новое всплывающее окно всегда содержит содержимое выбранного элемента div.
Не могли бы вы дать предложения
Чистый javascript предпочтительнее
HTML:
<div class = "s1" onclick = "basicPopup('',this);">Div 1</div>
<div class = "s1" onclick = "basicPopup('',this);">Div 2</div>
JS:
function basicPopup(url,t1) {
popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
popupWindow.document.body.innerHTML = t1.innerHTML;
return false; //make sure parent window doesn't refresh
if (popupWindow.document.body.innerHTML==t1.innerHTML){
return false; //if equal do nothing
}
else {
popupWindow.document.body.innerHTML='';
popupWindow.document.write(t1.innerHTML);
}
}
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Удалите return false перед оператором if. Возврат немедленно завершает функцию, и любой код после нее не будет запущен.
JSFiddle: http://jsfiddle.net/mu6751xk/
function basicPopup(url,t1) {
popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
popupWindow.document.body.innerHTML = t1.innerHTML;
}
Thanks. But when I say "do nothing" if div 1 content exists in the popup, I mean that div 1 should not be clickable, so multiple clicks on div 1 should fail. (ie popup window shouldn't refresh, parent window would cover popup window)
Вы должны выполнить проверку, прежде чем пытаться открыть всплывающее окно.
JSFiddle: http://jsfiddle.net/xrsw4Lou/
Спасибо. Но когда я говорю «ничего не делать», если во всплывающем окне есть содержимое div 1, я имею в виду, что на div 1 нельзя нажимать, поэтому несколько щелчков по div 1 должны завершиться ошибкой. (т.е. всплывающее окно не должно обновляться, родительское окно будет закрывать всплывающее окно)
@AA Я добавил решение для этого.
Помимо return false, вы также сначала присваиваете значение div окну, а затем проверяете, что, конечно, всегда будет возвращать true.
function basicPopup(url,t1) {
popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
if (popupWindow.document.body.innerHTML==t1.innerHTML){
return false; //if equal do nothing
}
else {
popupWindow.document.body.innerHTML='';
popupWindow.document.write(t1.innerHTML);
}
}
Я удалил оба:
popupWindow.document.body.innerHTML = t1.innerHTML;
return false; //make sure parent window doesn't refresh
ОБНОВИТЬ: На самом деле мы здесь слишком много думаем. Кажется, что простое присвоение нового значения делает то же самое, за исключением того, что оно каждый раз заполняет контент:
function basicPopup(url,t1) {
popupWindow = window.open(url,'popUpWindow','height=500,width=500,left=100,top=100, resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
popupWindow.document.body.innerHTML = t1.innerHTML;
}
Мне известен последний блок кода, который вы написали, но он всегда загружает всплывающее окно без проверки содержимого. Я хочу явно сделать так, чтобы, если содержимое всплывающего окна равно содержимому, по которому щелкнули, ничего не делать (т. Е. Div будет неактивным, всплывающее окно упадет ниже родительского окна)
Именно это и делает первый блок кода. Назначьте ТОЛЬКО, если он еще не назначен. То, что вы делали, было сначала слепым назначением, а затем проверкой назначенных данных с назначенными данными, что всегда было правдой. Откажитесь от второго блока (обновленного) и попробуйте первый блок моего кода.
у вас есть возврат false перед IF. После возврата ничего не происходит.