javascript - 如何修复浏览器移动视图中未定义问题的 jQuery“长度”?
问题描述
我正在创建输入表单,用户可以在其中添加一些文本。如果输入值为空,则禁用提交按钮,如果输入文本,则启用提交按钮。我创建的代码运行良好,但是当我使用移动或触摸视图(chrome 开发工具切换设备工具栏)时不起作用。我认为问题是触摸但我无法解决。
$('#imgText').on('keyup keypress', function() {
if($(this).val().length >= 1) {
$("#generate-img").removeClass("no-click");
}
});
$('#imgText').on('keyup', function() {
if($(this).val().length == 0) {
$("#generate-img").addClass("no-click");
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
解决方案
您可以改用 jQuery 的.on('input')
方法来捕获对字段值所做的更改。
$(document).ready( function() {
$('#imgText').on("input", function() {
if($(this).val().length == 0) {
$("#generate-img").addClass("no-click");
} else {
$("#generate-img").removeClass("no-click");
}
});
});
.no-click {
background-color: red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="imgText">
<input id="generate-img" type="submit" class="no-click">
推荐阅读
- captiva - 如何修复“unknown project ID (no ID found) (Dispatcher API Error: 9)[CR][LF]”错误?
- amazon-web-services - 使用错误选择的分区键在 GSI 上读取 DynamoDB 是否会影响表的读/写
- flutter - 如何在flutter中没有FCM的情况下向特定用户发送消息
- vispy - 在 vispy 中使用 MatrixTransform 更改立方体的维度
- python - 无法编译模型 CNN-LSTM 图像分类
- angular - 不同模块的组件功能之间的通信
- sql - 返回重新激活的用户 teradata sql
- python - 我在尝试将 python 连接到 mysql 时遇到不同的错误
- android - 将位图图像传递给 Android 应用程序中的另一个活动
- python - numpy中的选择性行和矩阵