Javascript-文字输入属性

Question

我需要创建一个表单元素

<input disabled type =“ text” value =“水木清华” />

默认情况下是禁用的。 它在发生onmouseover时启用。

的onmouseover = “this.disabled = FALSE;”

并被onmouseout禁用

的onmouseout = “this.disabled = TRUE;”

---

我需要检查以下内容。 如果<input>是焦点，则不应禁用它。

如果form元素失去焦点，则会禁用它。

请帮助我完成活动。

<input disabled type =“ text” value =“水木清华” onmouseover =“ this.disabled = false;” onfocus =“ ??? ” onblur =“ ??? ” onmouseout =“ if（ ??? ）{this.disabled = true;}” />

Answer 1

这是行不通的，因为在大多数浏览器中， onmouseover不会在禁用的输入上触发。 （Opera是一个例外，IE通常不会例外，除非使用拖动操作对其进行欺骗。）

无论如何，对我来说，这听起来像是一个很奇怪且用户不友好的把戏。 为什么要禁用它？ 如果在尝试与之交互时变为非禁用状态，则似乎没有任何意义（但是在可访问性方面存在很多不足）。

如果只是样式，请使用样式：

<style type="text/css">
    .weirdinput { color: silver; }
    .weirdinput:hover, .weirdinput:focus { color: black; }
</style>

<input class="weirdinput" value="smth" />

但是，IE <8不支持:focus ，而IE <7不支持:hover在非链接上，因此，如果您需要它来工作，则必须添加一些脚本，例如。 就像是：

<style type="text/css">
    .weirdinput { color: silver; }
    .weirdinput:hover, .weirdinput:focus, .weirdhover, .weirdfocus { color: black; }
</style>

<input class="weirdinput" value="smth" />

<!--[if lt IE 8]><script type="text/javascript">(function() {

    // Fix focus/hover for IE on all inputs with class 'weirdinput'
    //
    var inputs= document.getElementsByTagName('input');
    for (var i= 0; i<inputs.length; i++) {
        var input= inputs[i];
        if (input.className.indexOf('weirdinput')!==-1) {
            input.onmouseover= mouseover;
            input.onmouseout= mouseout;
            input.onfocus= focus;
            input.onblur= blur;
        }
    }

    function mouseover() {
        this.className+= ' weirdhover';
    }
    function mouseout() {
        this.className= this.className.replace(' weirdhover', '');
    }
    function focus() {
        this.className+= ' weirdfocus';
    }
    function blur() {
        this.className= this.className.replace(' weirdfocus', '');
    }

})();</script><![endif]-->

Answer 2

你能做的是

1. 重点放在将变量设置为true；
2. 模糊时，将变量设置为false； 和禁用true
3. 如果onmouseover设置为true，则将其禁用为false
4. onmouseout设置被禁用，仅当变量为false时； （所以不专心）

Answer 3

我认为您将很难解决此问题，因为禁用的字段不会收到mouseover （或mouseenter ，如果您的浏览器支持）事件。 我什至尝试在事件下方的元素上捕获事件，但禁用字段会吞噬事件。

Answer 4

禁用字段未提交，不在关键选项卡节点列表中，并且不侦听或传递事件。 您禁用输入，以便用户无法更改其值。

没有首先获得焦点，就无法更改任何字段。

您只能通过脚本更改禁用的属性，该脚本可能来自页面其他位置的事件。

但是，如您的示例所示，如果没有名称，则无论如何该字段的值都不会连同其表单一起提交，那么该字段是否被禁用怎么办？

如果您的目的是在未启用javascript的情况下禁用该字段，为什么不直接使用CSS隐藏该字段并以脚本样式显示它呢？