响应式文件管理器回调函数
Responsive filemanager callback function
我在<input>#image_link。
responsive_filemanager_callback函数应在何处以及如何使用?
我正在努力让它按照RFM文档和下面的代码中提到的那样工作。这是更新<img>#image_preview在RFM9中选择图像后。
这是我的代码:
<input id="image_link" name="link" type="text" value="">
<a class="btn iframe-btn" type="button" href="<?=FILEMANAGER_PATH;?>/dialog.php?type=1&field_id=image_link">Select</a>
<img id="image_preview" src="" />;
<script>
$('.iframe-btn').fancybox({
'width' : 900,
'height' : 600,
'type' : 'iframe',
'autoScale' : false
});
$('#image_link').on('change',function(){
alert('change triggered');
});
function responsive_filemanager_callback(field_id){
console.log(field_id);
var url=jQuery('#'+field_id).val();
alert('update '+field_id+" with "+url);
//your code
}
</script>
上的$('#image_link')。("更改")函数无法识别RFM的更改。
感谢您的投入!
创建链接:
<a href='Address_Of_dialog.php?type=0&field_id=name'>open_fancybox</a>
请注意href属性中的最后一部分,field_id参数,即输入字段的id
<input id='name'>
现在,如果你点击链接,fancybox将打开,你应该写以下代码来打开fancybox:
$('a').fancybox({
type: 'iframe',
minHeight: '600'
});
然后,如果您单击Responsive filemanager中的任何图像,该图像的url将打印在输入字段上,fancybox将自动关闭。
因此,您不需要任何功能来从响应式文件管理器中获取信息,但如果您想在这之后做任何事情(如预览所选图像),您可以添加以下功能:
function responsive_filemanager_callback(field_id){
//write whatever you want
//you can change the src of an <img> using the <input> value
}
该功能将在选择图像并关闭fancybox后立即触发,因此它非常方便且易于使用。
如果您想要一个干净的文件地址,您可以将relative_url=1添加到href地址,如下所示:
<a href='Address_Of_dialog.php?type=0&field_id=name&relative_url=1'>open_fancybox</a>
我的解决方案是修改filemanager/js directory.. (or include.min.js.
中的include.js文件,它在dialog.php 246行中定义)
因此,在第500行的include.js文件中,您可以找到function apply_img(file,external)
在函数末尾添加以下行:
if (typeof **parent.**responsive_filemanager_callback == 'function')
{ parent.responsive_filemanager_callback(external); }
}
"父母"是最重要的。。我想,这是因为iFrame。。因此,如果您在html文档中添加.aresponsive_filemanager_callback函数,它就会运行它。
On change事件用于跨域示例的演示,因此您可以删除。您必须编辑responsive_filemanager_callback函数。剩下的代码还可以,请参阅我的自定义示例
我现在找到了另一个通过javascript检测输入更改的解决方案。
按间隔检查可能不是很漂亮,但简单、快速、可靠。感谢@kikito!
https://github.com/splendeo/jquery.observe_field
<input id="image_link" name="link" type="text" value="">
<a class="btn iframe-btn" type="button" href="<?=FILEMANAGER_PATH;?>/dialog.php?type=1&field_id=image_link">Select</a>
<img id="image_preview" src="" style="display:none;" />;
<script type="text/javascript" src="/jquery.observe_field.js"></script>
<script>
$('.iframe-btn').fancybox({
'width' : 900,
'height' : 600,
'type' : 'iframe',
'autoScale' : false
});
$(function() {
// Executes a callback detecting changes with a frequency of 1 second
$("#image_link").observe_field(1, function( ) {
// alert('Change observed! new value: ' + this.value );
$('#image_preview').attr('src',this.value).show();
});
});
</script>
设法解决了问题。遵循代码:
HTML:
<input id="image_link" name="link" type="text" value="">
<a class="btn iframe-btn" type="button" href="<?=$filemanager_path;?>/dialog.php?type=1&field_id=image_link">Select</a>
<div id="cont-img"><img id="image_preview" src="" style="display:none;" width="303" /></div>
JAVAscript:
<script>
function responsive_filemanager_callback(field_id){
console.log(field_id);
var url=jQuery('#'+field_id).val();
//alert('update '+field_id+" with "+url);
//your code
$('#image_preview').attr('src',document.getElementById("image_link").value).show();
parent.$.fancybox.close();
}
</script>
我使用fanybox打开和关闭弹出
- 如何将一个JavaScript函数回调为多个函数
- Meteor:异步函数回调异常:onAfterAction
- 从类方法中的 ajax post 函数回调函数更改 javascript 类属性
- jQuery动画函数回调错误
- jquery在html属性中添加函数回调,以便在其他事件中调用
- jquery getjson 函数:回调返回错误的字符串
- postMessage - 多个 postMessage 事件/函数/回调
- 在 Promise 调用的错误函数回调后附加对象的用法是什么
- 单击事件后的 JavaScript 函数回调
- 设置超时函数回调静态变量
- Jquery UI 模式匿名函数回调以打开对话框
- 函数回调、局部变量和 chrome.storage.sync.get
- Jquery Ajax 没有拾取选项参数中指定的函数回调
- 如何在 javascript 中进行函数回调
- 用函数回调封装JavaScript
- jQuery JavaScript嵌套异步函数回调
- Node.js-匿名函数回调
- 函数回调超出范围
- php代码的Javascript函数回调
- 如何使用函数回调在更改时提交表单