仍然有在只读文本字段中添加工具提示的方法

Question

我想通过使用jquery在只读字段中添加工具提示。从只读文本框中读取数据并显示为工具提示。我无法在Google的任何地方找到其解决方案

 $(document).ready(function () {
    $('#nextDate').keyup(function () {
        $(this).attr('title', $(this).val())
    })
}) 

html

 <td><input type="text" title="" id="nextdate" class="form-control" readonly=""/></td>

但不起作用

Answer 1

如果您插入任何自定义字符串（如readonly =“ Hi this is readonly”，则您不应该在readonly内插入任何字符串，Inside readonly应该为true / false或readonly =“ readonly”）。这将使输入在chrome等智能浏览器中变为只读，但在旧的浏览器中可能会中断。因此，如果您想显示任何自定义消息，则可以创建和自定义属性，如下所示：

 <input type="text" readonly="readonly" data-readonly="hi, i am readonly" value="Hi i am input3" />

您可以通过以下方式获得此值：

$(this).attr('data-readonly')

您还可以检查此小提琴：https://jsfiddle.net/nr06Lmte/

Answer 2

我正在使用鼠标悬停事件而不是keyup事件。可能对您有用。

  <td><input type="text" title="hello" id="nextdate" class="form-control" value="2020-10-10" readonly="" onmouseover="myFunction()"/></td>
<script>
function myFunction(){
 document.getElementById('nextdate').setAttribute('title',   document.getElementById('nextdate').value);
}
</script>