JavaScript передает переменные между функциями и обрабатывает их

Question

Я работаю над страницей на основе JavaScript, которая возвращает стоимость доставки в зависимости от того, что выберет пользователь (регион, услуга (до 12 и т. Д.) И вес).Я запутался, потому что просто не знаю JS.

Мои вопросы:

1. Могу ли я передать переменную между функциями - как подробно описано в сценарии ниже?
2. После того, как все вышеперечисленное было достигнуто, мне нужно обработать переменные, чтобы отобразить результат, теперь я мог бы сделать массивный ifelse, на самом деле не хочу, потому что будет около 30 странных возможностей.Вся необходимая информация находится в базе данных SQL, так что это мой предпочтительный выбор, но я не уверен, как это сделать с JS, со всей браузерной стороной, со стороны сервера.Нужно ли передавать переменные (как указано выше) в PHP (после установки всех 3), чтобы получить данные из базы данных SQL?Если это так, я не уверен, как это сделать.

3. Если я использую PHP, тогда страница должна быть перезагружена, возможно ли сделать так, чтобы это было незаметно для пользователя, т.е.все их выборки по-прежнему отображаются?

   function flag(nation, area) {
     this.nation = nation;
     var el = document.getElementById("desc");
     el.innerHTML = 'The region you have selected is <b>' + area + '</b>';
     document.getElementById("flag").innerHTML = '<img src="images/flags/' + nation + '.jpg">';
   }
   
   function output(service) {
     this.service = service;
     var el = document.getElementById("service-desc");
     el.innerHTML = 'You have selected a <b>' + service + '</b> service.';
     document.getElementById("clock").innerHTML = '<img src="images/clock-' + service + '.png">';
   }
   
   function result() {
     //get varibles(nation & serive) from functions above ~ not sure how to do this!
     //process varibles
     if (nation == "UK" && service == "Standard next day") {
       document.getElementById("result").innerHTML = '£9.99';
     } else if (nation == "UK" && service == "Before 12pm") {
       document.getElementById("result").innerHTML = '£14.99';
     }
     // etc,etc,etc....
     else {
       document.getElementById("a1").innerHTML = "";
     }
   }
   

Answer 1

Существует три основных варианта:

• Пусть PHP-скрипт разместит все данные на странице в виде массивов JavaScript и обрабатывает все в JavaScript.Если общий объем данных не слишком велик, это правильное решение
• Перезагрузить всю страницу, когда пользователь делает выбор, и обрабатывать все в PHP (включая сохранение существующих выборок) - это единственный способзаставить работать без JavaScript, но в противном случае имеет только недостатки.
• Используйте AJAX , когда пользователь делает выбор, т.е. JavaScript вызывает сервер в фоновом режиме, а специальный PHP-скрипт возвращает только соответствующиеданные (обычно в формате JSON ), которые затем JavaScript использует для обновления страницы.Вот как это обычно делается в наши дни.

Answer 2

В javascript, если вы объявляете переменную вне функции, вы можете использовать ее из любой функции, это глобальная переменная. Э.Г.

var x, y;
function flag(nation,area)
{
  x = nation;
  y = area;
}
function output(service)
{}    
function result() {
  //In here you can do whatever you want with x and y
}

Лучше всего создать скрипт PHP, который получает ваши данные из базы данных и возвращает их в ваш javascript. Лучший способ сделать это - вызов AJAX, который позволит вам без всяких усилий получать данные из нужной базы данных и обновлять только определенные части страницы, а не всю страницу.

Я бы порекомендовал взглянуть на jQuery , так как он имеет несколько очень простых в использовании AJAX методов. Это просто библиотека, которая включает в себя javascript и имеет множество простых в использовании функциональных возможностей, хорошее введение vids здесь

Вот учебник о том, как использовать jQuery для вызова сценария PHP, который получает данные из базы данных.

Answer 3

Вы хотите AJAX - напишите фид данных на стороне сервера в PHP и мини-приложение на стороне браузера в JS, которое взаимодействует с фидом сервера и соответствующим образом обновляет веб-страницу. Это достигается с помощью объекта XMLHttpRequest Javascript. Я настоятельно рекомендую вам научиться использовать его, а затем положиться на библиотеку JS, которая обволакивает его и предоставляет сервисы более высокого уровня (например, jQuery)