HTML 表单 - 电话相对值不会在焦点上消失

Question

嗨，我

有一个 html 表单，我有一些 javascript 可以运行，每次您专注于输入字段时，rel 值都会消失，但是它适用于所有输入类型，除了电话和我不确定我做错了什么。

javascript是：

$(document).ready(function() {
    $('select.fancyselect').fancySelect();
    $('input[type=text], input[type=email], input[type=phone], input[type=url], textarea,').focus(function(){ 
        if($(this).val() == $(this).attr('rel')) {
            $(this).val('');
        }
    });
    $('input[type=text], input[type=email], input[type=phone], input[type=url], textarea').blur(function(){
        if($(this).val() == '') {
            $(this).val($(this).attr('rel'));
        } 
    });

"电话表单"字段的 HTML 为：

<div class="control-group">
                                <label class="control-label" for="field-phone">Phone Number:<br /> <em>(Optional)</em></label>
                            <div class="controls">
                                <input type="number" name="field-phone" id="field-phone" value="<?= $_POST['field-phone']; ?>" rel="Phone number here...">
                            </div>
                          </div>

我也在使用引导程序，我发现这个问题只发生在火狐而不是 chrome 或 safari 中。

Answer 1

您正在使用CSS选择器input[type=phone]，该选择器指的是您没有的<input type='phone'/>。您正在使用<input type='number'/>因此需要使用 CSS 选择器input[type='number'] 。

Answer 2

试试这个：

<input type="text" onfocus="if(this.value == '<?= $_POST['field-phone']; ?>') { this.value = ''; }" value="<?= $_POST['field-phone']; ?>" />