В проектах часто возникает ситуация, когда существует список, например список дел, и нажатие на элемент в списке приведет к переходу на страницу сведений. Подробности генерируются на основе выбранной записи, поскольку случаи и страницы конкретных сведений добавляются пользователями позже. Когда мы начинаем писать, исчерпать их все невозможно. Поэтому при переходе на страницу нам необходимо передать параметр, чтобы мы могли сделать запрос данных через этот параметр, а затем сгенерировать страницу на основе данных, возвращаемых фоном. Поэтому перепрыгнуть через тег точно не получится.
Мы часто пишем формы. При отправке мы можем передавать параметры. Если мы используем форму и скрываем ее, эффект должен быть достигнут.
Кроме того, того же эффекта можно добиться с помощью window.location.href и window.open.
1. Передаем параметры через форму <html lang=en> <head> <!--Формат кодировки веб-сайта, международная кодировка UTF-8, китайская кодировка GBK или gb2312 --> <meta http-equiv=content-type content=text/html;charset=utf- 8 /> <meta name=Keywords content=Ключевые слова один, Ключевые слова два> <meta name=Description content=Содержимое описания веб-сайта> <meta name=Авторское содержимое=Иветт Лау> <title>Документ</title> <!--Знакомство с файлом css js --> <!-- <link rel=shortcut icon href=images/favicon.ico> --> <link rel=stylesheet href=/> <тип сценария = текст/javascript src = jquery-1.11.2.min.js></script> </head> <body> <имя формы = метод frm = get action = get.html onsubmit = return foo() style = Position:relative;> <input type=hidden name=hid value = index = Lemon> <img class = more src = main_jpg10.png /> <input type = submit style = Position:absolute; слева: 10 пикселей; сверху: 0 пикселей; ширина: 120 пикселей; высота: 40 пикселей; непрозрачность: 0; курсор: указатель;/> </form> <имя формы = метод frm = get action = take.html onsubmit = return foo() style = Position:relative;> <input type=hidden name=hidden value = index = aaa> <img class = more src = main_jpg10.png /> <тип ввода = стиль отправки = позиция: абсолютное; левое: 10 пикселей; сверху: 0 пикселей; ширина: 120 пикселей; высота: 40 пикселей; непрозрачность: 0; курсор: указатель;/> </form> <имя формы = метод frm = get action = get.html onsubmit = return foo() стиль = позиция: относительная;> <тип ввода=скрытое имя=скрытое значение = индекс = bbb> <img class = more src = main_jpg10.png /> <тип ввода = стиль отправки = позиция:абсолютный;левый:10 пикселей; верх: 0 пикселей; ширина: 120 пикселей; высота: 40 пикселей; непрозрачность: 0; курсор: указатель;/> </form> </body> </html><script> function foo(){ var frm = window.event.srcElement frm.hid.value =; $(frm.hid).attr(index); вернуть истину </script>;Когда вы нажмете на изображение, оно перейдет на страницу получения.html. URL-адрес страницы становится:
Строка, которую мы хотим передать, передана.
Затем выполните разделение строк по текущему URL-адресу.
window.location.href.split(=)[1]//Получить лимон
После того, как мы получим параметры, которые необходимо передать, на основе этого мы можем перейти к следующему шагу.
Помимо вышеупомянутого разделения строк для получения параметров, передаваемых URL-адресом, мы также можем получить их с помощью обычного сопоставления и метода window.location.search.
2. Через window.location.hrefНапример, когда мы щелкаем по списку, нам нужно передать строку на страницу Detail.html, а затем страница Detail.html загружает содержимое страницы через данные взаимодействия Ajax на основе переданного значения.
var index = лимон; var url = get.html?index=+index; $(#more).click(function(){ window.location.href = url; });Текущая страница будет заменена страницей Recieve.html, а URL-адрес страницы станет следующим:
Затем мы используем описанный выше метод для извлечения нужных нам параметров.
3. Через window.location.openЕсли вы хотите открыть новую страницу вместо изменения текущей, то window.location.href неприменим. В настоящее время для этого нам нужно использовать window.location.open().
Краткое введение в функцию window.open(). window.open() имеет три параметра. Первый параметр — это URL-адрес открываемой страницы. Второй параметр — это цель окна. Третий параметр — это конкретная строка. Логическое значение, указывающее, заменяет ли новая страница текущую загруженную страницу в истории браузера. Необходимо передать только первый параметр. Второй параметр также может быть специальным именем окна, например _blank, _self, _parent, _top. _blank открывает новое окно, а _self обеспечивает тот же эффект, что и window.location.href.
Продолжая приведенный выше пример:
<script> var index = лимон; var url = get.html?index=+index; $(#more).click(function(){ window.open(url) });</script>Таким образом, при нажатии откроется новая страница с тем же URL-адресом, что и выше.
Из-за ограничений безопасности браузера некоторые браузеры добавляют ограничения на настройку всплывающих окон. Большинство браузеров имеют встроенные программы блокировки всплывающих окон. Таким образом, всплывающие окна могут блокироваться при блокировке всплывающих окон. необходимо учитывать. Одна из возможностей заключается в том, что встроенная программа блокировки браузера блокирует всплывающие окна, поэтому window.open(), скорее всего, вернет значение Null. На этом этапе вы можете определить, заблокировано ли всплывающее окно. путем мониторинга возвращаемого значения.
var newWin = window.open(url);if(newWin == null){ alert(всплывающее окно заблокировано);}Второе — всплывающее окно, заблокированное расширением браузера или другой программой. Тогда метод window.open() обычно выдает ошибку. Поэтому, чтобы точно определить, заблокировано ли всплывающее окно, необходимо определить возвращаемое значение и at. в то же время window.open() инкапсулируется в блоке try-catch. В приведенном выше примере его можно записать следующим образом:
<script> вар заблокирован = ложь; попробуйте { вар индекс = лимон; вар URL = get.html?index=+index; $(#more).click(function(){ var newWin = window.open(url); if (newWin == null) {blocked = true; } }); } catch(ex){block = true; if(blocked){ alert(всплывающее окно заблокировано);Выше приведено все содержание этой статьи. Я надеюсь, что она будет полезна для изучения всеми. Я также надеюсь, что все поддержат сеть VeVb Wulin.