当从onchange事件调用函数时,this.value将显示为unfind

时间:2016-02-15 21:11:16

标签: javascript

class Model
{

  function __construct()
  {
       $this->db = Database::getConnection();
  }

}

Javascript被调用但是this.value未定义。我知道我可以使用

  

$('dropdown1')。value

但我试图理解为什么<select id="dropdown1" name="dropdown1" onchange="dropdown1_onchange();"> <option selected value=""> Select</option> <option value="value1">value1</option> <option value="value2">value2</option> <option value="value3">value3</option> </select> function dropdown1_onchange() { alert(this.value); } 有时代表当前对象和其他时间 - 窗口。通常,当我使用内联javascript this是当前对象的表示...

4 个答案:

答案 0 :(得分:0)

问题在于this内部函数dropdown1_onchange是指window。您可以使用参数来检索值。

function dropdown1_onchange(elem)
{
   alert(elem.value);
}

答案 1 :(得分:0)

您不应该使用内联JavaScript。更改您的代码以使用如下所示的事件侦听器:

<select id="dropdown1" name="dropdown1">
        <option selected value=""> Select</option>
        <option value="value1">value1</option>
        <option value="value2">value2</option>
        <option value="value3">value3</option>
</select>
<script>
document.getElementById('dropdown1').addEventListener('click', dropdown1_onchange);
function dropdown1_onchange(event)
{
    alert(event.target.value);
}
</script>

答案 2 :(得分:0)

您可以使用此功能:

function dropdown1_onchange(el) {

    if (el.selectedIndex <= 0)
        return null;

    alert(el.options[el.selectedIndex].value);

}

JS Bin here

答案 3 :(得分:0)

您可以通过2种方式挂钩select元素的onchange事件。

<强>内联 将事件处理程序代码放在Select elements onchange =“”属性中。这将成为整个事件处理函数。它基本上是用函数调用

包装的
<select id="dopdown1" onchange="dropdown1_change">
</select>

// EXAMPLE FUNCTION OF WHAT HAPPENS BEHIND THE SCENES.
// This function exists in the browers/javascript framework.
// Your code will be executed inside its context.
function sudo_eventhandler(event)
{
    // Whatever is inside your onchange="" attribute
    dropdown1_change(this);
}

function dropdown1_change(element)
{
    alert(element.value);
}

因此,您必须将this或任何其他属性传递给您在此函数之外调用的任何方法,因为this不再是元素。

事件处理程序 您可以通过在javascript中选择它来将自己的事件处理程序连接到元素。

document.getElementById('dropdown1').addEventListener('click', dropdown1_onchange);

function dropdown1_change()
{
    alert(this.value);
}

这使得您的事件处理程序成为实际的处理程序,而不仅仅是从处理事件内部调用的方法。所以this现在是你期望的元素,因为元素本质上是调用方法而不是窗口。