Question

我有一个表单输入，当文本输入时，它会更新一个div。这就是我使用的：

$('#CampaignTitle').keyup(function() {
    $('#titleBar').text(this.value);
});

除了我还喜欢隐藏div的能力（我知道如何让它从隐藏开始）时，表格输入中没有文字。

换句话说，当有人输入表格输入时，会出现一个div，输入输入的文字会出现在div中。如果用户再次清除输入，则div消失。

抱歉，我是JS的新手：）

Answer 1

进行测试以查看文本框的值是否大于0：

$('#CampaignTitle').keyup(function() {
    if($(this).val().length > 0)
    {
        $('#titleBar').text($(this).val()).show();
    }
    else
    {
        $('#titleBar').hide();
    }
});

这里的关键是if($(this).val().length > 0)。

Answer 2

这样的事情应该有效：

$('#CampaignTitle').keyup(function() {

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

    if(this.value.length == 0) {
       $titleBar.hide();
    }

    else { 

       if($titleBar.is(":hidden")) { 
          $titleBar.show();
       }

       $titleBar.text(this.value);
    }
});

它有点冗长，并且有一些方法可以让它变得不那么冗长，但是既然你还在学习，我想这会让你大致了解发生了什么。 is(":hidden")检查可以省略;即使已经可见，它也会在show()上运行$titleBar。

Answer 3

试试这个

$('#CampaignTitle').keyup(function() {
    $('#titleBar').text(this.value).show();
    if (this.value==''){ $('#titleBar').hide() }
});

Answer 4

$('#CampaignTitle').keyup(function() {
    if (this.value){
        $('#titleBar').text(this.value).show();
    }
    else {
        $('#titleBar').hide();
    }
});

如果将文本输入到表单输入中，如何显示div

4 个答案: