修改上传文件按钮值

最新推荐文章于 2023-03-04 12:50:39 发布
最新推荐文章于 2023-03-04 12:50:39 发布 1369 收藏 1
分类专栏： 关于javaScript 文章标签： input javascript upload button function html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dinglinhu/article/details/2652894
版权

<html>
<head>
<title>File Upload Example </title>
<script language="JavaScript" type="text/javascript">
function HandleFileButtonClick()
{
document.frmUpload.myFile.click();
document.frmUpload.txtFakeText.value = document.frmUpload.myFile.value;
}
</script>
</head>
<body>
<form name="frmUpload">
<input type="file" name="myFile" style="display: none">
<input type="text" name="txtFakeText" readonly="true">
<input type="button" οnclick="HandleFileButtonClick();" value="Browse">
</form>
</body>
</html>

阅读终点，创作起航，您可以撰写心得或摘录文章要点写篇博文。去创作
dinglinhu
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论
专栏目录
css 表单上传文件的“浏览”按钮修改
12-11
图中用到的图片： <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”> <html> <head> <meta http-equiv=”content-type” content=”text/html; charset=utf-8″>...}
如何更改上传文件的的按钮的值
wlxtaking的专栏
12-26 1304
这个一般改不了。但是可以利用技巧来完成。将上传文件的那个先隐藏，然后添加一个文本框和一个按钮，然后利用js改变 实例代码：  File Upload Example <!-- function HandleFileButtonClick() { document.frmUpload.myFile.click(); document.frmUplo
[css]自定义input文件上传按钮样式
weixin_53236070的博客
03-04 811
使用css自定义input文件上传按钮样式
修改文件上传按钮样式
never give up的专栏
04-26 4820
页面中修改文件上传默认按钮样式！
文件上传按钮样式修改及上传文件名显示
zhizhuo0915的博客
05-03 5699
nput file上传按钮的美化思路是，先把之前的按钮透明度opacity设置为0,然后，外层用div包裹，就实现了美化功能。代码如下：DOM结构：&lt;a href="javascript:;" class="a-upload"&gt; &lt;input type="file" name="" id=""&gt;点击这里上传文件 &lt;/a&gt
修改文件上传 input type="file"按钮的样式
闪黑的博客
05-31 4205
改变文件上传 input type="file"按钮的样式 在使用传统原生input file时，通常会想要使得按钮的样式换成自己定义的样式 主要思想 1、使得原按钮在当前位置透明 2、将自己需要的样式覆盖到原按钮上面（通过设置margin的负值可以实现，当然也可能有其他方法） <!-- HTML代码 --> <div class="text-center profilesubm...
html表单上传文件的“浏览”按钮修改方法
09-28
html表单上传文件的“浏览”按钮修改方法
Extjs的FileUploadField文件上传出现了两个上传按钮
01-19
使用Extjs的FileUploadField插件上传文件，因为FileUploadField是ext的拓展插件所以在其api中是找不到其方法的，这个文件在extjs的examples文件夹下的ux中，所以在使用FileUploadField的时候必须将其引入过来才可以...
如何将上传文件的浏览按钮修改为自定义按钮
qq_20507573的博客
01-05 2260
大致思想就是：将真的file进行隐藏，使用普通的text和button拼接成我们的文件上传样式。然后设置button的onclick事件，该事件响应的是又是file的click事件，最后设置file的onchange事件，当file改变时将file的value值填充到text的value中（也就是文件的上传路径）。 　　代码如下： 　　 　　　　 　　　　onchange="documen
上传图片修改默认button的值
Roger的东西
07-11 96
File Upload Example function HandleFileButtonClick() { document.frmUpload.myFile.click(); document.frmUpload.txtFakeText.value = document.frmUpload.myFile.value; } 不...
（论坛答疑点滴）上传控件怎么修改样式？怎么设置readonly？
01-06 1445
例子如下：html>head>    title>File Upload Exampletitle>    script language="JavaScript" type="text/javascript">    function HandleFileButtonClick()    {        document.frmUpload.myFile.click();    
input上传文件按钮使用
09-27 5287
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  protected void bupload_ServerClick(object sender,EventArgs e)  {   ///判断上传的文件
layui文件上传控件带更改后数据传值
damosk的博客
03-19 8862
1，文件上传控件开启2，before内添加方法，以json格式存储数据。数据以对象形式存在，切对象格式不能直接传到后台，所以转化为json格式再进行传送。3，后台String接收param参数，转为json，直接通过get方法取值保存后台代码：...
layui上传文件按钮
最新发布
07-23
在 Layui 中，你可以使用 `upload` 组件来实现文件上传按钮。以下是一个基本的示例代码： ```html <input type="file" name="file" id="uploadBtn"> ``` ```javascript layui.use('upload', function() { var upload = layui.upload; // 选择文件后的回调函数 upload.render({ elem: '#uploadBtn', // 绑定上传按钮的选择器 url: '/upload', // 上传接口的 URL done: function(res) { // 上传成功的回调函数 console.log(res); // 文件上传成功后的操作 }, error: function() { // 上传失败的回调函数 // 文件上传失败后的操作 } }); }); ``` 在上述代码中，我们首先在 HTML 中创建了一个文件上传按钮，其 ID 设置为 `uploadBtn`。然后，在 JavaScript 中，我们使用 `layui.use('upload', ...)` 来加载 Layui 的 `upload` 组件，并使用 `upload.render()` 方法将上传按钮与上传接口进行绑定。 在 `upload.render()` 的配置中，我们指定了上传按钮的选择器（`elem`），上传接口的 URL（`url`），以及上传成功和失败的回调函数（`done` 和 `error`）。你可以根据实际需要修改这些配置。 当用户选择文件后，点击上传按钮时，会触发相应的回调函数。在示例代码中，我们简单地在控制台输出了上传成功时的响应结果（`res`）。 请注意，为了使文件上传正常工作，你需要确保在页面中正确加载了 Layui 的相关资源和样式文件。 希望这对你有所帮助！如果有任何进一步的问题，请随时提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

dinglinhu

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值