0

我有一个输入,这意味着在加载时专注于但它不会保持专注。您可以看到它在加载时会聚焦,但会很快恢复到原来的“未聚焦”状态。我正在使用的 JQuery 代码是:

$(document).ready(function() {
$("#searchinput").addClass("lightIn").val("Enter a car..").focus();
$("#searchinput").on("keyup",function (event) {
    event.preventDefault();
    var qdata=$("#searchinput").val();
    $("#results").load("search.php", {query: qdata}, function(response, status, xhr){
        if (status == "error") {
            alertify.alert("There has been an error, please refresh and try again!");
        }
    });
    return false;
}).on("keydown", function (event) {
    if ($(this).hasClass("lightIn"))
    {
        $(this).removeClass("lightIn").val("");
    }
}).on("blur",function () {
    $("#find").removeClass("select");
    if ($(this).val()=="")
    {
        $(this).addClass("lightIn").val("Enter a car..");
    };
});
$("#searchgo").on("click",function (event) {
    event.preventDefault();
    var qdata=$("#searchinput").val();
    $("#results").load("search.php", {query: qdata}, function(response, status, xhr){
        if (status == "error") {
            alertify.alert("There has been an error, please refresh and try again!");
        }
    });
return false;
});

});

该网站 - http://joshblease.co.uk/JQuery/find.php

到目前为止,我正在使用 Chrome 进行测试

4

1 回答 1

0

好吧,还是做个回答吧。

您的输入 HTML:

<input id="searchinput" class="transparent" placeholder="Enter a car..." autofocus />

还有你新的更高效的 jQuery:

var $searchinput = $('#searchinput');

function returnResults(qdata,e){
    e.preventDefault();
    $('#results').load('search.php', {query: qdata}, function(response, status, xhr){
        if (status == "error") {
            alertify.alert("There has been an error, please refresh and try again!");
        }
    });
}    

$searchinput.on({
    keyup:function(e) {
        returnResults($(this).val(),e);
    },
    keydown:function() {
        if ($(this).hasClass("lightIn")) {
            $(this).removeClass("lightIn").val("");
        }
    },
    blur:function() {
        $("#find").removeClass("select");
    }
});

$("#searchgo").on("click",function(e) {
    returnResults($searchinput.val(),e);
});

这将非常适用于 IE9+ 和所有真正的浏览器。保存IE8的占位符JS解决方案-。

于 2013-06-10T20:51:34.917 回答