jquery-ui - jQuery .show() 不适用于 标签

Question

这看起来非常简单。我有一个文本框，我希望根据其中是否有内容显示一个链接。在我的 document.ready 中，我将代码设置为

    $(document).ready(function () {
        $('#searchValue').change(function () {
            if ($('#searchValue').val().length > 0) {
                $('#home').show();
            } else {
                $('#home').hide();
            }
    });

这是我的 ASP MVC View 中的部分，其中包含我所指的链接。我希望每次加载页面时都显示跨度之外的所有内容。仅当文本框中有信息时，span 中的任何内容。

    @Html.ActionLink("Create New", "Create") |
    @Html.ActionLink("Export to Spreadsheet", "ExportToCsv") 
    <span class="home" style="display:none;">
    | @Html.ActionLink("Back to Index", "Index")       
    </span>

我已经尝试过使用和不使用 style="display:none;" 属性，但无法获取 .show() 或 .hide () 来触发。然而，我已经单步执行了代码，可以看到 doucment.ready 中的条件正在起作用，并且正在达到代码的该部分。

Answer 1

您需要类选择器而不是 id selector ，您将 home 作为 span 的类，而不是 id，您可以将 home 分配给 id 或使用 class selector 。

更改

 $('#home')

至

$('.home')

您的代码将是

$(document).ready(function () {
    $('#searchValue').change(function () {
        if ($('#searchValue').val().length > 0) {
            $('.home').show();
        } else {
            $('.home').hide();
        }
});