Question

如您所见，我的输入和选择正在执行一个功能。在该函数中，我需要检测哪个输入或选择被修改并获得其值。

我该怎么做？无法找到符合我需求的好答案。

<input type="text" name="1" id="1" onchange="some_function"/>
<input type="text" name="2" id="2" onchange="some_function"/>
<select name="3" id="3" onchange="some_function">
    <option></option>
</select>
<select name="4" id="4" onchange="some_function">
    <option></option>
</select>

Answer 1

首先，不要使用事件属性。使用不显眼的事件处理程序来连接您的事件。

其次，要解决实际问题，可以使用事件处理程序中的this关键字来引用引发事件的元素。从那里，您可以检索元素的必需属性。当您使用jQuery时，您可以这样做：

＆＃13;

jQuery(function($) {
  $('input').on('input', some_function);
  $('select').on('change', some_function);
});

function some_function() {
  console.log(`${this.name} = ${this.value}`);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="1" id="1" />
<input type="text" name="2" id="2" />
<select name="3" id="3">
    <option>A</option>
    <option>B</option>
    <option>C</option>
</select>
<select name="4" id="4">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

＆＃13;

Answer 2

您可以通过使用this关键字传递元素来在javascript中执行。对于输入字段onchange将无效。你必须使用oninput

＆＃13;

function some_function(obj){
console.log(obj.id +"changed with value-" +obj.value);
}

＆＃13;

<input type="text" name="1" id="1" oninput="some_function(this)"/>
<input type="text" name="2" id="2" oninput="some_function(this)"/>
<select name="3" id="3" onchange="some_function(this)">
   <option>1</option>
    <option>2</option>
</select>
<select name="4" id="4" onchange="some_function(this)">
    <option>1</option>
    <option>2</option>
</select>

＆＃13;

Answer 3

尝试以下方式：

Exception in Application constructor
java.lang.reflect.InvocationTargetException
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
    at java.lang.reflect.Method.invoke(Unknown Source)
    at com.sun.javafx.application.LauncherImpl.launchApplicationWithArgs(LauncherImpl.java:389)
    at com.sun.javafx.application.LauncherImpl.launchApplication(LauncherImpl.java:328)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
    at java.lang.reflect.Method.invoke(Unknown Source)
    at sun.launcher.LauncherHelper$FXHelper.main(Unknown Source)
Caused by: java.lang.RuntimeException: Unable to construct Application instance: class SeqDiagDriver
    at com.sun.javafx.application.LauncherImpl.launchApplication1(LauncherImpl.java:907)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication$154(LauncherImpl.java:182)
    at java.lang.Thread.run(Unknown Source)
Caused by: java.lang.InstantiationException
    at sun.reflect.InstantiationExceptionConstructorAccessorImpl.newInstance(Unknown Source)
    at java.lang.reflect.Constructor.newInstance(Unknown Source)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$160(LauncherImpl.java:819)
    at com.sun.javafx.application.PlatformImpl.lambda$runAndWait$174(PlatformImpl.java:326)
    at com.sun.javafx.application.PlatformImpl.lambda$null$172(PlatformImpl.java:295)
    at java.security.AccessController.doPrivileged(Native Method)
    at com.sun.javafx.application.PlatformImpl.lambda$runLater$173(PlatformImpl.java:294)
    at com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:95)
    at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at com.sun.glass.ui.win.WinApplication.lambda$null$147(WinApplication.java:177)
    ... 1 more
Exception running application SeqDiagDriver

function some_function(thatVal){
  var val = '';
  if($(thatVal)[0].nodeName=='SELECT'){
    var id = $(thatVal).attr('id');
    val = $('#'+id+' option:selected').text();
  }
  else{
    val = $(thatVal).val();
  }
  console.log(val);
}

检测哪个输入/选择已更改并获取其值

3 个答案: