无法使用 JQuery 在页面加载中触发 onchange 事件 [重复]答案

【问题标题】：Can't trigger onchange event in page load using JQuery [duplicate]无法使用 JQuery 在页面加载中触发 onchange 事件 [重复]
【发布时间】：2014-12-11 08:34:14
【问题描述】：

目前我有一个带有以下代码的链接 NEW IMAGE。

<a class="cmpn_image" href="javascript:void(0);" id="new_page_image">NEW IMAGE</a> 

 /* Associated function */
 $("#new_page_image").click(function() { 
          imgType = 'NPG';
          $("#uptext_new_page").trigger('click');
 });

点击链接会打开文件上传窗口。

现在我需要的是，如果 url 中存在值，则在页面加载时触发相同的文件输入。下面显示的是我的代码：

<script>
$(document).ready(function()
{
    var param=getparamvalue('p');   // function for getting url paramater
    if(param=='new')
    {                                // upto this is working fine
        $("#uptext_new_page").trigger('change');   // not working; here if the paramter is present the file upload window should come triggering the file input
    }
});
</script>

<div style="visibility:hidden;">
    <form method="post">
      <input type="file" name="name" id="uptext" onChange="ajaxUpload(this.form,'imageUpload.php?filename=name&amp;maxSize=9999999999&amp;maxW=1000&amp;relPath=uploads/images/&amp;colorR=255&amp;colorG=255&amp;colorB=255&amp;maxH=400','uploadProgress','&lt;br /&gt;&lt;img src=\'images/loader_light_blue.gif\' width=\'128\' height=\'15\' border=\'0\' /&gt;','&lt;img src=\'images/error.gif\' width=\'16\' height=\'16\' border=\'0\' /&gt; Error in Upload.'); return false;" />
    </form>

  <form method="post">
      <input type="file" name="name" id="uptext_new_page" onChange="ajaxUpload(this.form,'imageUpload.php?filename=name&amp;maxSize=9999999999&amp;maxW=1000&amp;relPath=uploads/reference/&amp;colorR=255&amp;colorG=255&amp;colorB=255&amp;maxH=400','uploadProgress','&lt;br /&gt;&lt;img src=\'images/loader_light_blue.gif\' width=\'128\' height=\'15\' border=\'0\' /&gt;','&lt;img src=\'images/error.gif\' width=\'16\' height=\'16\' border=\'0\' /&gt; Error in Upload.'); return false;" />
    </form>
</div>

在页面加载本身时，如果参数p 的值为new，则应显示文件上传框。但它不起作用。

我也试过

$("#uptext_new_page").change();

谁能帮我解决这个问题？

提前致谢。

【问题讨论】：

try $(document).on('change','$uptext_new_page',function(){}) bcz 我面临同样的问题，我通过这个代码更改解决了
尝试使用 jQuery 而不是内联绑定您的事件：$('#uptext_new_page').change(function() { ajaxUpload($(this).closest('form;), ...); return false; }).trigger('change');
@Affan：这应该不是问题，因为 JS 被包裹在 $(document).ready() 中，并且没有迹象表明这些字段是在文档准备好后动态添加的。
@Jenz：如果你使用$(this).closest('form')，它会找到this（意思是文件输入）在里面的形式。
@Jenz：我不确定你在问什么。如果你做$('#uptext_new_page').change(function() { var form = $(this).closest('form'); });，那么'change'事件监听器只绑定到#uptext_new_page元素，$(this).closest('form')只会找到当前元素（即#uptext_new_page）在里面的表单。

标签： php jquery html file-upload

【解决方案1】：

你试过click吗，让我们试试

$("#uptext_new_page").trigger('click');

或者你甚至可以尝试为点击事件创建一个隐藏按钮，例如

<form method="post">
  <input type="file" name="name" id="uptext_new_page" onChange="ajaxUpload('something here'); return false;" />
  <input type="button" style="display:none;" onclick="ajaxUpload('something here'); return false;" id="uptext_new_page_bnt">
</form>

在你的 jQuery 中试试

$('#uptext_new_page_bnt').trigger('click');

【讨论】：

@Gautam ..我也试过了。但不工作。
@Gautam..这也不适用于文件上传。我试着在触发点击时回显一个文本。那是有效的。但是文件上传窗口没有显示。
我尝试添加一个按钮并在页面加载时触发点击按钮。在按钮的单击功能上，我触发了文件输入的单击。但这也行不通。

【解决方案2】：

我不相信您可以触发文件输入以打开“选择文件”对话框而无需一些用户交互。我相信如果用户点击另一个元素，你可以在那个时候触发文件对话框上的点击事件，但我不认为你可以在没有一些用户交互的情况下做到这一点。见：

所有这些示例都展示了如何在用户点击另一个元素而不是页面加载时触发文件上传窗口。

使用 JavaScript (window.open()) 打开新窗口也是如此。如果您在没有用户交互的情况下随机执行此操作，我相信它会被弹出窗口阻止程序捕获。这可能是一个类似的问题。

实际上，这个问题似乎与Show input file dialog on load? 重复，并且那里的答案与我的相似（没有用户交互无法做到）。

【讨论】：