两个网页上的 onChange 事件答案

【问题标题】：onChange event on two web pages两个网页上的 onChange 事件
【发布时间】：2013-04-09 04:45:35
【问题描述】：

我有两个网页。一个是main.php，另一个是combo.php。 combo.php 包含一个下拉列表，我已将此页面包含在我的 main.php 中。

我想要做的是当有人在我的下拉列表中选择一个选项时，应该有一个警告框指示我选择的项目。

main.php

<html>
  <body>
    <form>
      //some elements
      <?php include 'combo.php';?>
    </form>
  </body>
</html>

combo.php

<html>
  <body>
    <form>
      //some elements
      <select name="combo">
        <option value="1">America</option>
        <option value="2">England</option>
        <option value="3">India</option>
        <option value="4">Japan</option>
      </select>
      //some elements
    </form>
  </body>
</html>

我无法对我的 combo.php 进行任何更改。 onChange 事件和脚本应该在我的 main.php 中。我不知道该怎么做，我也不知道这是否可能。任何有关此事的帮助将不胜感激。谢谢。

【问题讨论】：

你必须看看JAVASCRIPT。根据组合的构造，您将能够在组合上的“更改”事件上添加侦听器并提醒用户或其他任何东西。 Javascript 代码可以在main.php 上，因为在客户端，combo.php 或main.php 没有任何区别。客户端收到一个独特的生成文件，其中包含 HTML 代码和可能的 Javascript 代码。
我对我的combo.php做了这样的事情
并在我的 main.php 中调用它
函数选项Alertone(aaa) { $abc = aaa; alert('您已选择类别：'+$abc); }

标签： php drop-down-menu web onchange

【解决方案1】：

您可以为此使用 Jquery，因为您必须包含此脚本，

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {

    $("#getSelect").change(function() {
        alert($(this).val());
    });

});
</script>

其中 getSelect 是选择控件的 id。

之后添加下面的 php 代码。

<form>
      //some elements
      <select name="combo" id="getSelect" onChange="return getSelect(this.value)">
        <option value="1">America</option>
        <option value="2">England</option>
        <option value="3">India</option>
        <option value="4">Japan</option>
      </select>
      //some elements
   </form>

【讨论】：

如果您使用 jQuery 设置事件处理程序，则不应在 <select> 标签上包含 onChange="..."。
@AnthonyGrist，感谢您的回复，但我不知道为什么我们不能使用它？它工作正常。你能解释一下吗？
@YadavChetan 你可以使用它，你只是不需要。 jQuery 部分使 HTML 中的 onchange 属性变得不必要。

【解决方案2】：

像这样添加一个javascript函数：

function getValue(val) {
    alert(val);
}

然后在你的下拉列表中像这样在 onChange 属性上添加这个函数

<select name="combo" onchange="getValue(this.value);">
    <option value="1">America</option>
    <option value="2">England</option>
    <option value="3">India</option>
    <option value="4">Japan</option>
</select>

当您更改下拉列表的值时，您应该会在警告框中看到这些值。

【讨论】：

无法更改combo.php :p
但是我的演讲说我不能像这样修改我的combo.php onchange="getValue(this.value);"
还有其他方法吗？
我必须在哪里添加此代码？在我的main.php 中吧。我知道这可能是一个愚蠢的问题。但我真的很陌生，我很迷茫。

【解决方案3】：

如果您可以使用 jQuery，您只需在您的 main.php 中添加一些代码

$(document).ready(function() {

    $("#idOfYourSelect").change(function(changeEvent) {
        alert("Your value : " + $(this).val());
    });

});

假设您的 <select> 至少有一个 id idOfYourSelect（或一个名称，或一个 css 类名 - 可以让您从 javascript 代码中检索它的东西）

这将在change 事件上添加一个侦听器，并在您每次更改值时运行回调。

如果你不能使用jQuery，那会有点复杂，你必须玩弄浏览器的差异，并使用addEventLister或attachEvent来添加你的监听器。

attachEvent documentation（旧版 IE）

addEventListener 用于 Firefox、webkit 等

我建议您使用 jQuery，它会为您处理所有这些差异。

【讨论】：

是的，我可以使用 jQuery。我可以将它添加到我的 main.php 中还是需要一个单独的文件？对不起，我真的不知道该怎么做。
您只需通过在 HTML 文档的 <head> 中添加 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 标记来添加 jQuery 脚本（如果 main.php 包含 <head> 标记，那么，是的，这是在main.php)。然后，添加我发布的代码，以便在您的 <select> 上添加一个侦听器。

【解决方案4】：

好吧，如果你不能改变它，那么如果你使用 JQuery，你可以像这样添加

$('select[name*="combo"]').change(function() {
      var str = $('select[name*="combo"]').val();
      alert (str);

  });

在 $(document).ready(function) 中添加这个

【讨论】：

谢谢。我终于做到了。 :)
Cheers Mate..Happy Coding :)