Question

我一直在尝试使用文本字段设置值，然后将这些值通过网址传递到另一个网页。我认为我的方法有效，但事实并非如此，我在这里意识到自己的错误。

我有一个像这样的文本字段：

  Voornaam: <h3 class="title1">Kevin</h3>
  <input type="text" id="myTextField1" />
  <input type="submit" id="byBtn" value="Change" onclick="change1()"/><br/>

这可以触发change1（）函数：

function change1(){
   var myNewTitle = document.getElementById('myTextField1').value;
   if( myNewTitle.length==0 ){
       alert('Write Some real Text please.');
   return;
   }
  document.getElementById("myLink").href="convert.php?var1=" + myNewTitle +"&var2=";
   var titles = document.getElementsByClassName('title1');
   Array.prototype.forEach.call(titles,title => {
    title.innerHTML = myNewTitle;
   });
}

正如你所看到的那样设置var1但是var2为空，var 2应该来自另一个链接到change2（）的文本字段，除了href行之外，它是整个相同的函数，该行更改为：< / p>

   document.getElementById("myLink").href="convert.php?var1=&var2=" + myNewTitle;

据我所知，当我调用这两个函数时，并且change2（）最后一个.. var 1再次为空。但是我希望它们都设置为var1和var2。

是否有人可能稍微调整我的代码，以便它实际上保持它们的两个而不是另一个？

另外，我确实更喜欢我的文本字段的单独功能。

Answer 1

尝试这样的事情（只使用一个更改按钮）：

＆＃13;

document.querySelector('#myBtn').addEventListener('click', function change() {
  function isInvalid(input) {
    return input.value.length == 0;
  }

  var titles = [...document.querySelectorAll('[class^="title"]')];
  var inputs = [...document.querySelectorAll('[id^="myTextField"]')];
  var anchor = document.querySelector('#myLink');
  
  if (inputs.some(isInvalid)) {
    alert('Write some real text please.');
    
    anchor.href = 'convert.php';
  } else {
    var querystring = inputs.map((input, index) => `var${index + 1}=${titles[index].textContent = input.value}`);
    
    anchor.href = `convert.php?${querystring.join('&')}`;
  }
});

＆＃13;

a:after {
  content: attr(href);
}

＆＃13;

Voornaam:
<h3 class="title1">Kevin</h3>
<input type="text" id="myTextField1" />
<br/><br/>
Achternaam:
<h3 class="title2">Bosman</h3>
<input type="text" id="myTextField2" />
<br/><br/>
<input type="button" id="myBtn" value="Change" />
<br/><br/>
<a id="myLink" href="convert.php"></a>

＆＃13;

只有一个值传递给另一个php页面

1 个答案: