Member 13810592 Ответов: 1

Как изменить HTML-страницу, прежде чем я перенаправлю себя на нее.

У меня есть одна html-страница, и у меня есть вторая html-страница . я хочу перенаправить себя со страницы один на страницу два, но прежде чем я буду перенаправлен на страницу два, мне нужно показать что-то в html страницы 2 . Может ли кто-нибудь сказать мне, как это сделать ?
На первой странице у меня есть какая-то форма, и когда форма заполнена и предварительно нажата кнопка, Я не вызываю .ajax, и в функции успеха я хочу сделать некоторые изменения, прежде чем перенаправить себя на второй html. Проблема в том, что я перенаправляю себя на вторую страницу, но ничего не меняется ... мой элемент, который я хочу показать, не отображается ...

Что я уже пробовал:

$(document).ready(function(){
	
	$('#logovanje').submit(function(event){
		event.preventDefault();
		let korisnickoIme = $('#korisnickoIme').val();
		let lozinka = $('#lozinka').val();
		$.post({
			url: '../rest/logovanje',
			data: JSON.stringify({korisnickoIme: korisnickoIme, lozinka: lozinka}),
			contentType: 'application/json',
			success: function(data) {
				alert("Uspesno ulogovan korisnik")
                                $("#korisnik").hide();
				$("#korisnik1").show();
				window.location.replace( '../Pocetna.html' );
			},
			error: function(message) {
				alert("Neuspesno ulogovan korisnik")
			}
		});
	});
});

здесь:
$("#korisnik").hide();
$("#korisnik1").show();

korisnik и korisnik1-это id-форма второй страницы элемента div, и я пытаюсь показать ее и скрыть этот элемент div... пожалуйста, кто-нибудь может сказать мне, где я делаю неправильно здесь я не знаю, что делать...

Nathan Minier

Это есть причина, по которой вам нужно выполнить обратную передачу? Просто обновите содержимое div или другого контейнера, что упрощает обработку данных, которые должны охватывать запросы.

Member 13810592

Вы можете сказать мне, как это сделать ? я не думаю, что понимаю то, что вы мне говорите, потому что я новичок в этом деле :D

Member 13810592

if i learn it right now ,i do not need post back to the first page.I just need after user click on button i check all needed things if thats all is right i send him to second page but i need to show the second page whit changes of one div , one div is need to be show second to be hide... Actualy i have index page and on index page i have login when he click login then he is transfer to a second page whit login and then when he do it and click login on login.html i need to transfer him to the first page (index.html) but i do not need to show him again login , i need too show him div whit his user name , to give him information that he is login.... (i hope you understand me :D)

1 Ответов

Рейтинг:
10

Nathan Minier

Хорошо, то, что вы пытаетесь сделать, просто не будет работать, потому что вы вызываете изменения на текущей странице непосредственно перед изменением текущей страницы. То, что вы пытаетесь сделать, является довольно распространенным действием в современных веб-приложениях, но подход к ним совершенно отличается от того, который вы используете.

Позвольте мне привести вам очень простой пример того, как современная страница может быть структурирована с помощью jQuery, который вы используете (если вы действительно смотрите на фреймворки, Vue.js на самом деле это довольно хорошо и хорошо документировано).

Это не совсем то, о чем вы просите; это просто представление идей.

index.html:

<!DOCTYPE html>
<html>
   <head>
      <!-- SEO, metadata, etc here -->
      <script type="text/javascript" src=jQuery.js"></script>
      <script type="text/javascript" src="test.js"></script>
   </head>
   <body>
      <div id="header">
         <button id="loadButton">Clicky</button>
         <button id="showButton">Show</button>
         <button id="hideButton">Hide</button>
         <p>This is the standard header!</p>
      </div>
      <div id="content">
         <p>This will be immediately replaced</p>
      </div>
      <div id="footer">
         <p>This is the standard footer!</p>
      </div>
   </body>
</html>


loaded.html
<div>
   <p>This will be inserted into the #content div</p>
   <p id="dataPlaceholder">This will be changed by the script on the main page!</p>
</div>


Итак, теперь у нас есть шаблон с некоторыми данными-заполнителями. Далее нужно вставить заполнитель в div и получить в него ваши данные:

test.js
$('showButton').click(function(e){
   e.preventDefault();
   $('#content').show();
}

$('hideButton').click(function(e){
   e.preventDefault();
   $('#content').hide();
}

$(document).ready(function(){
   $.get({
      url: 'loaded.html',
      contentType: 'text/html',
      success: function(result){
         $('#content').html(result);
      }
   });

   $('loadButton').click(function(e){
      e.preventdefault();
      $.post({
         url: '/data/url/of/some/kind',
         contentType: 'application/json',
         success: function(data){
            $('#dataPlaceholder').text(data);
         }
      });
   });
});