标签: onchange

我希望你在文本字段中输入div更改(我已经有了更改div的代码).但是,onchange事件仅在完成后调用,并在文本字段外单击.我想要在每个字母输入时调用它.

我的代码:

<input name="platetext" type="text" onchange="setValue(this)">

我正在尝试从HTML下拉列表中创建一个快速的CSS样式切换器.JS是外部的,在表单之前的头部末尾调用.

我的JS:

function ChangeTheTheme(){
    txt = document.getElementsByTagName("link");
    switch(document.mytheme.themes.selectedIndex) {
    case 0:
        alert("Choice 0");
        txt[0].href = "style.css";
        break;
    case 1:
        alert("Choice 1");
        txt[0].href = "style2.css";
        break;
    }
}

重要的HTML行是:

<form name="mytheme">
<select name=”themes” onChange=”ChangeTheTheme();”>

我尝试在函数的开头添加"alert("working");它向我展示了该函数根本没有被调用.

下拉列表应将CSS样式切换为当前选择的任何样式.没有按钮提交或任何东西.这就是我对onchange的理解.

谢谢

一直在这方面工作太久......但似乎无法确定问题.已经阅读了有关stackoverflow和其他地方的数十篇文章.

当我点击并更改该值时,它不会自动提交:

   <form id="orderbyfrm" name="orderbyfrm" action="http://staging.whiterabbitexpress.com/" method="post" class="orderbyfrm">
            <input name="s" value="<?php echo $wre_search_txt?>" type="hidden">
            <label for="orderby" class="sortByLabel">Sort by&nbsp;</label>
            <select class="sortByDropdown" name="orderby" id="orderby" onchange="this.form.submit();">
                <option value="Relevance">Relevance</option>
                <option value="likes" selected="selected">Likes</option>
            <option value="comments" selected="comments">Comments</option>
            </select>
</form>

在Chrome检查器中,我看到一个错误"Uncaught TypeError:无法调用方法'提交'为null"onchange

我也试过onchange ="javascript:document.orderbyfrm.submit",但这也不起作用.

我很难根据select标签中的选定项目更改元素类.这是我的代码:

<table> 
    <tr>
        <select onchange="wow(this.value)">
            <option value="a">a</option>
            <option value="b">b</option>            
        </select>
    </tr>               
    <tr id="x" class="show">
        x
    </tr>
</table>

<script>
function wow(value){
    switch(value){
        case "a": document.getElementById("x").className = "show"; break;       
        case "b": document.getElementById("x").className = "hide"; break;
    }
}
</script>

<style>
.show{
    display:inline-block;
}

.hide{
    display:none;
}
</style>

我在这里没有看到任何问题.我也试过setAttribute("class", "show")但不行.

我刚刚发现了淘汰赛(3.0和3.1)和复选框的问题

问题是,复选框的更改事件绑定不会在不同的浏览器中一致地发生.

请参阅下面的代码

<table >
  <tr> 
    <td >
      <input type="checkbox" data-bind='checked: CheckVal, event: { change: refresh }' />
    </td>
    <td>Check Value in checked binding: <span data-bind="text: CheckVal"></span> 
    </td>
  </tr>
  <tr>
      <td></td>
    <td>Check Value in changed event binding: <span data-bind="text: CheckValChanged"></span> 
    </td>
    </tr>        
</table>

和javascript

function MainViewModel() {
    var self = this;
    this.CheckVal = ko.observable(true);
    this.CheckValChanged = ko.observable(true);

    this.refresh = function() {
        self.CheckValChanged(self.CheckVal());
    }
}

viewModel = new MainViewModel();
ko.applyBindings(viewModel);

在Firefox中,更改事件绑定发生在复选框值更改后,因此在更改事件处理程序中,我们可以读取复选框的实际值(即,如果选中复选框,则绑定字段的值为value = true).

在所有其他浏览器中(我使用Chrome,IE 11,Opera和Safari测试过),更改事件绑定似乎在实际更改绑定字段的值之前发生(即,选中复选框,在更改处理程序中读取的值)是false,如果未选中,则读取的值为true)

你可以在http://jsfiddle.net/bzamfir/su6SW/2/看到这个问题.

问题不仅在于浏览器中的行为不一致,而且对于大多数浏览器而言,这似乎是违反直觉的:事件是变化 …

我在最近的代码中遇到了一个奇怪的事情.

我有一个动态生成列表,其中每行包含一个复选框.我的意图是,如果复选框发生变化并得到确认,我的数据库将会更新.

问题是,它在我第一次改变时确实有效.但以下尝试没有.但是,如果我刷新页面,它会在我第一次更改时再次运行.

它必须是一些JavaScript的东西.

$(':checkbox').change(function() {
    if (confirm("Does the status of this survey really changed?")) {
        variable = $(this).val();
        $.post( "handler.php", { handler: '18', value: variable}, location.reload());
    }
});

PS:每次触发并且值发生变化时,也会警告"变量".

你能帮我解决一下吗？

提前致谢.

编辑:非常感谢所有答案.除了对事件委托的理解之外,帮助我的是,它对点击事件的效果更好.我仍然会试着理解在onblur触发onchange的重点是什么,但目前,保持onchange并没有帮助我.

我有很多HBox,里面有一些不同的组件(RadioButton,Labels,Buttons ......).RadioButtons位于ToggleGroup中,因此只能选择1个单选按钮.

我想在单选按钮上添加一个OnChange - Event.如果未选择RadioButton,则应该有一个事件触发器.如何将事件添加到单选按钮？

目前我有这样的代码,但它没有我想要的功能.

radio.setOnAction(new EventHandler<ActionEvent>() {

        @Override
        public void handle(ActionEvent arg0) {
            if(!radio.isSelected()){
                ivTriangleImg.setRotate(iRotateCoord2);
                btnTriangle.setGraphic(ivTriangleImg);
            }

            if(group!=null){
                group.selectedToggleProperty().addListener(new ChangeListener<Toggle>() {

                    @Override
                    public void changed(
                            ObservableValue<? extends Toggle> arg0,
                            Toggle arg1, Toggle arg2) {

                    }
                });
            }
        }
    });

我使用JavaFX 2.0和Java 1.7,所以我不能使用Lambda函数或JavaFx8/Java 1.8的特殊组件函数

据我了解，onFocus单击输入框时应调用它，而onBlur当其他内容成为焦点时应调用它。

我的意图是：我想调用一个函数，当单击激活该函数时，它将.concat成为focuse中输入框的消息字符串，但是我无法使用onFocus或onBlur工作。

从我发现的搜索范围来看，这应该可以解决问题，但事实并非如此。

import React, { Component } from 'react'
class SocialPost extends Component {
    state = {
        message: this.props.socialPost.message,
        focus: false
    }
    _onBlur() {
        setTimeout(() => {
            if (this.state.focus) {
                this.setState({
                    focus: false,
                });
            }
        }, 0);
    }
    _onFocus() {
        if (!this.state.focus) {
            this.setState({
                focus: true,
            });
        }
    }
    render() {
        return (
            <div className='...'>
                <div className='...'>
                    ...
                    <input
                        onFocus={this._onFocus()}
                        onBlur={this._onBlur()}
                        type='text'
                        value={this.state.message}
                        onChange={...}/>
                    ...
                </div>
            </div>
        ) …

问题是我有一个文件输入字段，一次只能获取一个文件，我需要像这样。

如果我尝试上传一个文件，一切都很好。但是，如果我需要上传更多文件，除非重新加载页面，否则好像没有调用“更改”处理程序方法，这不是任何人想要的。

HTML看起来像这样：

<div class="col-xs-7">
    <button
      class="btn btn-primary"
      [disabled]="isLoadingModal"
      (click)="activityFileInput.click()">
    archivo</button> {{ newActivity.fileName }}
    <input
      type="file"
      id="activity-file-input"
      [disabled]="isLoadingModal"
      (change)="selectFile(activityFileInput.files[0])"
      #activityFileInput
      hidden>
  </div>

该组件中的功能是：

selectFile(file: File): void {
    console.log('Hello');

    if(file == undefined)
      return;

    this.newActivity.fileName = file.name;
    this.newActivity.file = file;
}

在第一个文件上载时，显示“ Hello”，没有问题。但是该方法似乎没有被多次调用。如何解决呢？

我知道我一定会错过一些非常简单的东西，但是为什么没有onChangefor <Input>标签Ant design呢？

我想更新输入值。

我以为有什么样的onChange，因为我是能使用onChange与DatePicker和handleChange DropDown; 但我想我认为错了

当我查看文档时，有一个onPressEnter回调，但这并不能真正帮助我。

我尝试了以下方法：

   <Input
     placeholder="Flight name"
     size="large"
     value={this.state.someVal}
   />

但这只是给了我无法输入的输入。

所以重申一下：

1. 为什么没有onChangefor <Input>标签Ant design？
2. 更重要的是，如何获得<Input>标签的价值？

谢谢。