Передача параметров между несколькими функциями JavaScript

Question

Я хочу, чтобы у меня была такая JSP:

<form id="form1">
 Name is: <%=request.getParameter("name") %>
 <a href="#" onclick="fun1('<%=request.getParameter("name") %>')">Show Email Form</a>
</form>

<form id="form2">
 <input type="text" name="emailid" />
 <a href="#" onclick="fun2('$('input[name=emailid]').val()', <name required here>)">Submit</a>
</form>

Мой javascript выглядит примерно так:

function fun1() {
 //Nothing important here, just show second form
 $('#form2').show();
}

function fun2(myemail, myname) {
 //Do something important here,
 //Like update email for the given name
 xmlhttp = GetXmlHttpObject();
 var url = "updateEmail.do?email=" + myemail + "&name=" + myname;
 xmlhttp.open("POST", url, true);
}

Что следует отметить здесь:
1) Нетдействие связано с моей формой, я отправляю вторую форму через Ajax.
2) Мне нужно иметь две разные формы, первая форма имеет больше элементов, кроме имени.И вторая форма имеет другой набор элементов помимо электронной почты.Только для одной из функций (fun2) в form2 необходимы оба параметра имени из form1 и идентификатор электронной почты из form2.
3) Form1 имеет неизменяемый параметр имени, а form2 имеет редактируемый параметр электронной почты.Функция onclick в form2 принимает ввод текста электронной почты с помощью jQuery.
4) Еще один сценарий, который следует учитывать, - это наличие нескольких записей имени в форме form1, например, список имен с использованием циклов.Например,

<form id="form1">
 <logic:iterate id="record" name="peoplerecords" property="records">
  Name is: <bean:write name="record" property="name">
 <a href="#" onclick="fun1('<bean:write name="record" property="name">')">Show Email Form</a>
 </logic:iterate>
 </form>

Каков наилучший способ записи параметра имени из form1 в URL-адрес щелчка JavaScript в form2?

form1: - onclick = "fun1 (name);"
form2: - onclick = "fun2 (email, name);"

Answer 1

Вы можете либо напрямую ввести имя с помощью JSP:

<a href="#" onclick="fun2($('input[name=emailid]').val(), <%=request.getParameter("name") %>)">Submit</a>

Или вы можете присвоить узлу dom, содержащему имя, идентификатор и получить к нему доступ с помощью jQuery

Name is: <span id="nameNode"><%=request.getParameter("name") %></span>


<a href="#" onclick="fun2($('input[name=emailid]').val(), $('#nameNode').innerHTML)">Submit</a>

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

Answer 2

, поскольку значение вашего имени записывается с сервера (в JSP), вы можете просто записать его непосредственно в вызов fun2?

onclick="fun2('$(\'input[name=emailid]\').val()', '<%=request.getParameter("name") %>')"

Answer 3

Не помещайте 'data' в модель HTML.

Если вы используете язык на стороне сервера, передайте все данные непосредственно в ваши встроенные скрипты, а не во встроенный HTML.

Пример:

<a onclick="alert('<?php echo $the_string;?>');">alert!</a>

против

<a id="alert_link">alert!</a>

<script type="text/javascript">

    var the_string = <?php echo json_encode($the_string);?>;    // you get javascript safe encoding with json_encode, almost for free!

    document.getElementById("alert_link").onclick = function () {
        alert(the_string);
    };
</script>

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

На данный момент все ваши данные доступны в JavaScript, поэтому должно быть легко связать их все вместе.