HTML5 获取更改时的输入文件计数

2024-04-11

我需要使用 html5 文件 API 来获取输入文件元素中选择的文件数量,并在另一个元素中设置该值。

HTML

<div class="form-row">
    <label>Main Image</label>
    <div class="form-text">None Selected</div> 
    <input type="file" class="txtbox" name="proImage" id="proImage" value="" />
</div>

Jquery

$('input[type=file]').change(function () {
    $fileCount = $(this).files.length;
    $(this).parent('.form-row').find('.form-text').html($fileCount + 'Selected');
})

有人知道我哪里出错了吗?感谢所有帮助


files不是 jQuery 对象的属性。

改变这个:

$fileCount = $(this).files.length;

To:

$fileCount = this.files.length;

您还可以缩小选择器:

$('input[type=file]').change(function () {
    fileCount = this.files.length;
    $(this).prev().text(fileCount + 'Selected');
})

http://jsfiddle.net/hHgEF/ http://jsfiddle.net/hHgEF/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

HTML5 获取更改时的输入文件计数 的相关文章

  • 如何使用 JavaScript 将时间戳字符串转换为本地时间?

    我有一个 JSP 页面 其中我将存储在数据库中的时间戳作为字符串提取 其形式如下Thu Aug 21 2014 22 09 23 GMT 0530 India Standard Time 当然 我可以按原样在页面中显示它 但是我一直在寻找
  • 混合应用程序开发(PhoneGap、Cordova、Ionic)

    我试图了解一切是如何运作的 但对此主题有一些疑问 我将解释我如何理解这些东西 首先让我们从Cordova这是翻译平台JS CSS HTML文件到本机应用程序中 但这并不完全是事实 实际上 它只是将所有 html css 文件放入 asset
  • formatTime 以“h”而不是“:”作为分隔符

    葡萄牙时间使用以下 24 小时格式 18h30 我试过了 timeFormat H h mm timeFormat H h mm timeFormat H h mm 是否可以 谢谢 您需要使用单引号inside用于插入字母的 JavaScr
  • Firefox 渲染出错 - 看到一些非常奇怪的东西

    我的以下情况真的很奇怪 基本上 当我查看页面的源代码时 一切看起来都很好 但页面看起来完全错误 所以我决定使用 firebug 查看源代码 而 firebug 显示了一个非常不同的故事 但是 如果我刷新页面 页面看起来很好 并且源和萤火虫匹
  • 将屏幕大小从小屏幕调整为大屏幕时,jQuery 数据表宽度发生错误更改

    我用过responsive数据表的特点 https datatables net extensions responsive examples display types immediateShow 对于大屏幕 视图是这样的 对于小屏幕 视
  • 您可以强制 HTML 表单对相对 URL 使用 HTTPS 吗?

    我有一个网站 其中每个页面都通过 HTTPS 提供服务 在其中一个页面上 我有一个表单 其操作属性设置为相对 URL 包含表单的页面只能通过 HTTPS 访问 表单发布到的页面只能通过 HTTPS 访问 但在 IE 中 我收到一条安全警告
  • 如何将 ng-repeat 与图像映射区域标签一起使用?

    我正在尝试使用 AngularJS 创建可点击的汽车配置文件 一旦我将区域标签属性移动到 auto parts json 并将它们与 ng repeat 中的适当属性绑定 那么它就无法工作 如何修复它 请在全页预览中测试元素 var app
  • 动态更新 bootstrap 3 日期选择器选项?

    该日期选择器已经使用其他默认选项创建 但我需要使用以下新选项更新它 但它似乎不起作用 new options var new options format dd mm yyyy autoclose true language es upda
  • 将 h1 元素的内容复制到剪贴板?

    所以 我做了一个翻译器 但效果不是很好 但无论如何 它正在工作 我想尝试添加一些可以复制结果的内容 有没有办法做到这一点 以下是我的代码 提前致谢 我知道有一种方法可以通过输入来完成此操作 但我不确定是否可以通过标题来完成 var myTe
  • 在表单提交时发送 div 的值

    我正在尝试提交一个包含几个不同输入的表单 这些输入都工作正常 然而 输入之一是文本区域 某种程度 我必须将其更改为内容可编辑的 div 主要是因为我创建了自己的粗体 斜体和下划线按钮 这些按钮不适用于普通文本区域 问题是提交时的表单没有将文
  • 如何突出显示最靠近鼠标的文本行?

    我有一篇很长的文本 我想为用户提供阅读帮助 当前行应该突出显示 为了更简单 我将只使用鼠标的 Y 坐标 这样 鼠标指针就不会妨碍 我有一个带有 id 的大 DIVcontent它用类填充整个宽度和一个小 DIVcontent对于文本 请参阅
  • 缩放 MapBox GL 地图以适合标记集

    假设我有以下 Mapbox 地图代码 mapboxgl accessToken
  • 如何使用 rel=preload 预加载材质图标?

    我正在尝试使用谷歌灯塔优化我的网页 该报告指出 在导入 Material Design 图标的链接上使用 rel preloads 我尝试使用语法预加载它们 我也尝试过使用字体进行预加载 类型为 woff woff2 和 ttf 它们似乎都
  • 将 xml 传递给 jquery 脚本时出现问题

    我正在尝试使用 jsp 中的 bufferedReader 从本地路径读取 xml 并尝试将 xml 传递给 jquery 脚本 如下所示
  • Doctype的实际使用

    虽然我在 w3 org 上浏览了大量有关 Doctype 的信息并了解不同类型的 doctype 过渡型 严格型 框架集 我还是不太清楚在页面上使用Doctype的实际用途是什么 I mean 是为了阻止开发商 在代码中使用某些标签 例如
  • jsoup 的奇怪编码行为

    我用jsoup从不同页面的html源代码中提取一些信息 大多数都是UTF 8编码的 其中一个是用 ISO 8859 1 编码的 这会导致一个奇怪的错误 在我看来 包含错误的页面是 http www gudi ch armbanduhr me
  • 如何获取表单的onSubmit事件?

    我想知道如何抢onsubmit表单中的事件来进行一些表单验证 因为我无权直接访问它 我正在编写一个用于评论的 WordPress 插件 因此无法直接访问表单标签或提交按钮 我在尝试为我的插件执行此操作时感到非常沮丧 因此我在下面编写了一个
  • jQuery ajax 调用在 Mac Safari 和 Chrome 浏览器上返回空错误

    我几天来一直在寻找解决方案并尝试修复 但没有任何改变 老板使用的是 Mac 而我没有 所以我让他尝试重复修复并将输出转发给我 到目前为止还没有运气 因此 当前的设置是 我有一个包含用户名和密码输入的表单 该表单在经过验证后提交 验证是一个
  • 将聊天文本中的成对符号替换为 html 标签,以设置粗体、斜体和删除线样式

    我正在尝试制作 Whatsapp 风格的文本帖子 当用户创建这样的文本时 Hi how are you where are you 然后这个文本会像这样自动改变 Hi你好吗你在哪 我知道我可以使用 php 正则表达式来做到这一点 如下所示
  • JQuery - $.ajax() - 使用 JSONP 跨源 - 仅在 IE 8 中获取“parsererror”(在 IE 7 中工作)

    我有以下代码来执行跨域请求并获取 JSONP 数据 通过回调方法包装的 JSON 我已经验证我使用包装 JSON 数据的回调方法正确获得了响应 它在 IE7 中工作得很好 回调 cb 被调用 但在 IE8 中则不然 document rea

随机推荐