keyup（）上的jQuery更改input.value仅适用于FF 3.6

Ok, so I'm finally getting into jQuery but having what I hope are basic issues getting my functions to run. I have 3 input fields on a page, two of them are disabled. My goal is that when the user enters text into the first input field, the values of the other 2 fields would be changed on keyup() to the value entered by the user in the first input field.

好的，所以我终于进入了jQuery，但我希望是基本的问题让我的函数运行。我在页面上有3个输入字段，其中两个被禁用。我的目标是当用户在第一个输入字段中输入文本时，其他2个字段的值将在keyup（）上更改为用户在第一个输入字段中输入的值。

I tested my function on jsfiddle.net before I was able to put it on my page and it worked fine in all browser, but once i move that function to my web page and run it the function won't work. It seems to work in Firefox 3.6 but not any versions after that. It also doesn't work in chrome or IE for some reason either.

我之前在jsfiddle.net上测试了我的功能，然后才能将它放在我的页面上，并且它在所有浏览器中运行良好，但是一旦我将该功能移动到我的网页并运行它，该功能将无法正常工作。它似乎适用于Firefox 3.6，但之后没有任何版本。由于某些原因，它也无法在chrome或IE中使用。

jsfiddle Demo

jsfiddle演示

jQuery

jQuery的

$(document).ready(function () {
    var $title2 = $("#title2"),
        $title3 = $("#title3");
    $("#cheader").keyup(function () {
        $title2.val(this.value);
        $title3.val(this.value);
    });
    $("#cheader").blur(function () {
        $title2.val(this.value);
        $title3.val(this.value);
    });​
});

CSS

CSS

.nobox {
border: none;
text-align: center;
color: #000;
background-color: #fff;
text-decoration: underline; 
font-weight: bold;
font-size: 14px;
}

HTML

HTML

<input type="text" onClick="if(this.value=='Click Here To Enter Text'){this.value=''}else{this.value=this.value}" onBlur="if(this.value==''){this.value='Click Here To Enter Text'}" style="width:250px;" class="nobox" value="Click Here To Enter Text" maxlength="35" id="cheader"/>

<input type="text" style="width:250px;" class="cheader nobox" value="Click Here To Enter Text" id="title2" disabled disabled="disabled"/>​

<input type="text" style="width:250px;" class="cheader nobox" value="Click Here To Enter Text" id="title3" disabled disabled="disabled"/>​

1 个解决方案

#1

I changed $(document).ready(function () { to $(function() { and now everything works fine on all browsers. Not really sure why but it works now :D

我更改了$（document）.ready（function（）{到$（function（）{并且现在一切都在所有浏览器上运行正常。不确定为什么但现在可以正常工作：D

$(function() {
var $title2 = $("#title2"),
    $title3 = $("#title3");

$("#cheader").keyup(function() {
    $title2.val(this.value);
    $title3.val(this.value);
});
$("#cheader").blur(function() {
    $title2.val(this.value);
    $title3.val(this.value);
});