Question

所以我试图检查用户是否通过文本框userInput输入了文本。但是，当我尝试编写if else语句来验证输入时，似乎没有任何工作。有帮助吗？

<div class="container">
<div class="row">
    <div class="page-header">
        <h1 align="center">Sub To Me <small>Easily create YouTube subscription links!</small></h1>
    </div>
</div>

<script type="text/javascript">
    function showLink() {

                  $("#linkBox").css("visibility", "visible");

        $("#linkText").html("http://subto.me/"+$("#usernameInput").val())
        $("#linkHref").attr("href", "http://subto.me/"+$("#usernameInput").val())
}   
</script>

<div class="row">
    <div class="span6 offset3">
        <div class="form-inline">
            <div class="input-append">
                <input class="span4" type="text" id="usernameInput" placeholder="Youtube Username">
                <button class="btn" onClick="showLink();">Get Link</button>
            </div>
        </div>
    </div>
</div>
<div class="row" id="linkBox" style="visibility: hidden; margin-top: 25px;">
    <div class="span12">
        <div class="alert alert-success" style="width: 50%; margin: 0 auto; text-align: center; padding: 24px;">
            <a id="linkHref" href="" target="_blank"><span id="linkText" style="font-size: 24pt; font-weight: bold;"></span></a>
        </div>
    </div>
</div>

Answer 1

在这里，Thous应该阻止用户提交空白表格，不要忘记包含jquery库。

<script type="text/javascript" src="scripts/jquery-1.9.1.js"></script>
    <script type="text/javascript">
        function showLink() {
            var usernameInput = $('#usernameInput').val();
            if(usernameInput != ''){

                $("#linkBox").css("visibility", "visible");

                $("#linkText").html("http://subto.me/"+$("#usernameInput").val())
                $("#linkHref").attr("href", "http://subto.me/"+$("#usernameInput").val())
            }
            else{
                alert('Please Enter Something');
            }
    }   
    </script>
<div class="container">
<div class="row">
    <div class="page-header">
        <h1 align="center">Sub To Me <small>Easily create YouTube subscription links!</small></h1>
    </div>
</div>
<div class="row">
    <div class="span6 offset3">
        <div class="form-inline">
            <div class="input-append">
                <input class="span4" type="text" id="usernameInput" placeholder="Youtube Username">
                <button class="btn" onClick="showLink();">Get Link</button>
            </div>
        </div>
    </div>
</div>
<div class="row" id="linkBox" style="visibility: hidden; margin-top: 25px;">
    <div class="span12">
        <div class="alert alert-success" style="width: 50%; margin: 0 auto; text-align: center; padding: 24px;">
            <a id="linkHref" href="" target="_blank"><span id="linkText" style="font-size: 24pt; font-weight: bold;"></span></a>
        </div>
    </div>
</div>

Answer 2

<script type="text/javascript">
function showLink() 
{
    if($('#usernameInput').val()!= "")
    {
        $("#linkBox").css("visibility", "visible");
        $("#linkText").html("http://subto.me/"+$("#usernameInput").val());
        $("#linkHref").attr("href", "http://subto.me/"+$("#usernameInput").val());
    }
    else
    {
        alert("enter value")
    }
}
</script>

看看文本输入是否存在

2 个答案: