将鼠标悬停在图标上时如何显示指针答案

【问题标题】：How to display a pointer when hovering over an icon将鼠标悬停在图标上时如何显示指针
【发布时间】：2023-03-27 18:01:01
【问题描述】：

下面我有一个 Jquery datepicker 和一个 jquery timepicker（trent richardson 的 datepicker 和 timepicker）

 $(function() {
        $( "#datepicker" ).datepicker({minDate: 0, 
        dateFormat: "dd-mm-yy",
        showOn: "button",
        buttonImage: "Images/calendar.gif",
        buttonImageOnly: true});
    });



        $('#durationpicker').trenttimepicker({
            timeFormat:'hh mm ss',
            hourGrid: 4,
            minuteGrid: 10,
            secondGrid: 10,
            showOn: 'button',
            buttonImage: "Images/clock.gif",
            buttonImageOnly: true
            });

        });

现在日期选择器和时间选择器都可以通过用户点击一个图标来访问（日期选择器的日历图标和时间选择器的时钟图标（'#durationpicker'）。我的问题是我怎样才能得到它以便指针当用户将鼠标悬停在两个图标上时出现光标？

下面是html：

<p><strong>3: Duration:</strong> <input type="text" id="durationpicker" name="durationChosen" readonly="readonly" />

<p><strong>4: Date:</strong> <input type="text" id="datepicker" name="dateChosen" readonly="readonly" />

【问题讨论】：

标签： jquery datepicker timepicker

【解决方案1】：

.ui-datepicker-trigger{cursor:pointer}

【讨论】：

这是在 css 还是 jquery 中？我猜css
+1。 CSS。 .ui-datepicker-trigger 是 jQuery 日期选择器中图标的默认类。
在 CSS 中是的。它是包含此类的任何标记的光标属性。

【解决方案2】：

           $( ".ui-datepicker-trigger" ).css('cursor','pointer');

这适用于我的 jQuery 方式，你可以将它包含在你的脚本中，它不应该给你任何问题。我自己将它用于具有 jQuery ThemeSwitcher 和 jQuery UI 主题的项目。

这是一个疯狂的猜测，但应该会把你带到你需要的地方:)

【讨论】：

在 jQuery 函数中的选择器处： $( ".datepicker" ).datepicker({your options}); $('.durationpicker').trenttimepicker({你的选项});这样，您就可以根据浏览器的输出对每个 jQuery 库进行上述调整。我提到这一点是因为我在同一页面上有两个日期选择器并使用了这种方法，效果很好。接受的答案也是无效的，因为作为解决问题的 css 方法没有应该工作的悬停属性。请让我们知道这是否有效！ :)

【解决方案3】：

如果我理解您的问题，您需要为两个图标添加以下 CSS 代码

#durationpicker, #datepicker {
cursor: pointer;
}

【讨论】：

我认为你是对的，但只需将:hover 添加到选择器的末尾即可。
那是为文本框做的，我希望它用于文本框旁边的图标，而不是文本框。如果您查看功能，那是 buttonImage 我想在将鼠标悬停在图标上时显示指针光标
仅当您希望指针在悬停时出现时才添加:hover。 :focus 也是如此。
试试#durationpicker img, #datepicker img {cursor:pointer;}
不，仍然在做同样的事情。我在问题中包含了html。我相信它只能在 jquery 代码中完成，因为如果你知道我的意思，图标是内置的

【解决方案4】：

.ui-state-hover {
        cursor: pointer !important;
    }

为我工作

【讨论】：