Fatal编程技术网
  • javascript/
  • 我可以用javascript重写输入类型=文本元素的标题吗？

我可以用javascript重写输入类型=文本元素的标题吗？

javascript jquery html

我可以用javascript重写输入类型=文本元素的标题吗？,javascript,jquery,html,Javascript,Jquery,Html,有没有可能用js或其他技术覆盖HTML元素的标题？我的目标是根据if条件更改标题： 我试过不同的方法。其中一些是： $(document).ready(function(){ var name = $('#name').val(); if (name.length < 3) { $('#name').prop('title', 'New title'); } }); $（文档）.ready（函数（）{ var name=$（'#name'）.val

有没有可能用js或其他技术覆盖
HTML元素的标题？我的目标是根据if条件更改标题：

我试过不同的方法。其中一些是：

$(document).ready(function(){
    var name = $('#name').val();
    if (name.length < 3) {
        $('#name').prop('title', 'New title');
    }
});

$（文档）.ready（函数（）{
var name=$（'#name'）.val（）；
如果（名称长度<3）{
$（'名称'）.prop（'标题'，'新标题'）；
}
});
或

var name=document.getElementById（'name'）；
如果（名称长度<3）{
document.getElementById（'name'）。title='newtitle'；
}
到现在为止，没有一个起作用。谢谢

LE

这是我使用的完整示例，但它仍然没有按预期工作（最初：当表单未提交时，标题应为“blah”，在用户按下提交按钮后，如果文本框长度小于3，则应显示“新标题”）


文件
名称
去
$（文档）.ready（函数（）{
$（'表格'）。提交（功能（e）{
if（changeNameTitle（））
e、 preventDefault（）；//防止为无效数据提交表单
}
});
changeNameTitle（）；
});
函数changeNameTitle（）
{
if（$（'#name'）.val（）.length<3）{
$（'#name'）.attr（'title'，'newtitle'）；
返回true；
}
返回false；
}
我做错了什么？我已经在Firefox 40.0和IE 11中对其进行了测试

LE2 我终于找到了我想要的答案。这是基于Mihai的回答（我要感谢他）


文件
名称
去
函数changeNameTitle（）{
if（$（'#name'）.val（）.length<3）{
$（'#name'）.attr（'title'，'newtitle'）；
返回true；
}else if（$（'#name'）.val（）.length>=3）{
$（'#name'）.attr（'title'，'Ok'）；
返回true；
}
返回false；
}
您最初的问题是错误的。如果要在按下按钮后更改标题，必须按以下方式进行：

$(document).ready(function() {
    $('#form button').click(function() {
        changeNameTitle();
    });

    changeNameTitle();
});

function changeNameTitle()
{
    if ($('#name').val().length < 3) {
        $('#name').attr('title', 'New title');
    }
}

$（文档）.ready（函数（）{
$（“#表单按钮”）。单击（函数（）{
changeNameTitle（）；
});
changeNameTitle（）；
});
函数changeNameTitle（）
{
if（$（'#name'）.val（）.length<3）{
$（'#name'）.attr（'title'，'newtitle'）；
}
}
或者更好：

$(document).ready(function() {
    $('#form').submit(function(e) {
        if (changeNameTitle()) {
            e.preventDefault(); // prevent submitting the form for invalid data
        }
    });

    changeNameTitle();
});

function changeNameTitle()
{
    if ($('#name').val().length < 3) {
        $('#name').attr('title', 'New title');
        return true;
    }
    return false;
}

$（文档）.ready（函数（）{
$（'表格'）。提交（功能（e）{
if（changeNameTitle（））{
e、 preventDefault（）；//防止为无效数据提交表单
}
});
changeNameTitle（）；
});
函数changeNameTitle（）
{
if（$（'#name'）.val（）.length<3）{
$（'#name'）.attr（'title'，'newtitle'）；
返回true；
}
返回false；
}
使用
.attr（）
而不是
.prop（）
：

顺便说一句，document.getElementById（“#name”）获取一个id，这样就不需要
#
了，而且您还错误地将
#nume
用于最后一个id哦，对不起。这只是一个输入错误。在第一个示例中：
title
是一个属性，而不是属性。在您的第二个示例中：
id
s必须是唯一的，因此
.length
没有任何意义（并且在这方面没有定义
。
此外，如果“您使用
#nume
而不是
#name
”，
#
必须在vanilla JS
getElementById（）中删除
无论如何。@Sirko是的，很抱歉。只是有一些打字错误。我感觉很糟糕，因为我找不到任何修复程序，而且我正在赶路……仍然不起作用。你能检查我的更新吗？看看我更新的答案。你的第一个问题是错误的，因为我们不知道你需要做什么。（它不起作用。如果我使用你更新的代码，标题是。）“废话”（当页面加载时），不管文本框中是否有至少3个字符，它都会保持不变。Holly cow！我真的很笨，无法复制文本，或者这项技术出了问题？为了人类的利益，最好是第一个！它不起作用！它仍然保持为“废话”“而且它不会根据需要更改。我在第一篇文章中重新发布了整个html文档。请查看一下，可能是我使用了错误的bs版本，或者是错误的jquery版本？非常感谢！我刚刚更新了我的答案。代码中缺少一个
{
。
如果（changeNameTitle（））{
。请注意，您可以使用firebug调试js代码。请检查此演示。它现在正在工作

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>

    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
    <div class="container-fluid">
        <form id="form" method="post">
            <div class="form-group">
                <label for="name">Name</label>
                <input type="text" id="name" class="form-control" placeholder="Name" title="blah"/>
            </div>          
            <div class="form-group">
                <button type="button" class="btn btn-default" onclick="return changeNameTitle();">Go</button>
            </div>
        </form>
    </div>

    <script type="text/javascript">
    function changeNameTitle(){
        if ($('#name').val().length < 3) {
            $('#name').attr('title', 'New title');
            return true;
        } else if ($('#name').val().length >= 3) {
            $('#name').attr('title', 'Ok');
            return true;
        }
        return false;
    }
    </script>
</body>
</html>



$(document).ready(function() {
    $('#form button').click(function() {
        changeNameTitle();
    });

    changeNameTitle();
});

function changeNameTitle()
{
    if ($('#name').val().length < 3) {
        $('#name').attr('title', 'New title');
    }
}



$(document).ready(function() {
    $('#form').submit(function(e) {
        if (changeNameTitle()) {
            e.preventDefault(); // prevent submitting the form for invalid data
        }
    });

    changeNameTitle();
});

function changeNameTitle()
{
    if ($('#name').val().length < 3) {
        $('#name').attr('title', 'New title');
        return true;
    }
    return false;
}



$('#name').attr('title', 'New title');