Question

我有问题。根据以下代码， .srch-inpt 的值将根据所选的选项类进行更改。现在我需要删除焦点上的 .srch-inpt 的值，并让它恢复模糊。我写的代码不能正常工作..如果有人能帮助我，我感激不尽。谢谢！

这是我的HTML：

<select class="srchopts">
    <option class="bookopt">Book Option</option>
    <option class="articleopt">Article Option</option>
    <option class="thesisopt">Thesis Option</option>
    <option class="journalopt">Journal Option</option>
</select>
<input type="text" name="" class="srch-inpt" value="Title / Author / Keywords / ISBN" defaultValue="" />

和我的jQuery代码：

//Changing search value on select-box option change
$(function(){
    $('.srchopts').change(function () {
        var optclass = "";
        $("select option:selected").each(function () {
            optclass += $(this).attr('class');
        });
        if (optclass == 'bookopt' || 'thesisopt' ) {
            $('.srch-inpt').val('Title/ Author/ Keyword/ ISBN');
        }
        if (optclass == 'articleopt' ) {
            $('.srch-inpt').val('Title/ Author/ Keyword/ Doi');
        }
        if (optclass == 'journalopt' ) {
            $('.srch-inpt').val('Title/ ISSN');
        }
    });
    $('.srch-inpt').focus(function() {
        if ($(this).val() == $(this).attr('defaultValue'))
            $(this).val('');
        }).blur(function() {
            if ($(this).val() == '')
            $(this).val( $(this).attr('defaultValue') );
        });     
});

Answer 1

$('.srch-inpt').data('defaultValue','My default value').focus(function () {
    if (this.value === $(this).data('defaultValue')) this.value = "";
}).blur(function () {
    if (!this.value.length) this.value = $(this).data('defaultValue');
}).blur();

DEMO

Answer 2

我得到答案A.沃尔夫提到。因为我们没有＆＃34; DefaultValue＆＃34;新jQuery中的属性，我必须自己创建，并在每次更改 .srch-inpt 值时更新它的值。

所以，这是我的新jQuery代码：

//Changing search value on select-box option change
$(function(){
    $('.srchopts').change(function () {
        var optclass = "";
        $("select option:selected").each(function () {
            optclass += $(this).attr('class');
        });
        if (optclass == 'bookopt' || 'thesisopt' ) {
            $('.srch-inpt').val('Title/ Author/ Keyword/ ISBN');
        }
        if (optclass == 'articleopt' ) {
            $('.srch-inpt').val('Title/ Author/ Keyword/ Doi');
        }
        if (optclass == 'journalopt' ) {
            $('.srch-inpt').val('Title/ ISSN');
        }

        $('.srch-inpt').attr('defaultValue', $('.srch-inpt').val());
    });
    $('.srch-inpt').focus(function() {
        if ($(this).attr('defaultValue') == '')
            $(this).attr('defaultValue', $(this).get(0).defaultValue);


        if ($(this).val() == $(this).attr('defaultValue'))
            $(this).val('');
    }).blur(function() {
        if ($(this).val() == '')
            $(this).val( $(this).attr('defaultValue') );
    });     
});

DEMO

在以前动态设置值时删除焦点上的输入值

2 个答案: