Javascript 响应型filemanager回调函数

我在#image_链接上使用独立版本的Responsive Filemanager 9进行图像选择

应在何处以及如何使用响应的\u filemanager\u回调函数

我正试图让它的工作中提到的和下面的代码。 在RFM9中选择图像后，需要更新图像预览的src属性

这是我的代码：

<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>

;
$（'.iframe btn'）.fancybox（{
“宽度”：900，
‘高度’：600，
'type'：'iframe'，
“自动缩放”：错误
});
$（'#image_link'）。在（'change'，function（）上{
警报（“变更触发”）；
});
函数响应\u文件管理器\u回调（字段\u id）{
控制台日志（字段id）；
var url=jQuery（“#”+字段_id）.val（）；
警报（“更新”+字段id+”和“+url”）；
//你的代码
} 

（'change'）函数上的$（'image_link'）无法识别RFM所做的更改

---

谢谢你的投入

更改事件用于演示跨域示例，以便您可以删除。 您必须编辑响应的\u filemanager\u回调函数。

---

代码的其余部分还可以，请参见我的自定义示例

现在，我找到了另一个通过javascript检测输入更改的解决方案

按时间间隔检查可能不是很漂亮，但简单、快速、可靠。 感谢@kikito

;
$（'.iframe btn'）.fancybox（{
“宽度”：900，
‘高度’：600，
'type'：'iframe'，
“自动缩放”：错误
});
$（函数（）{
//以1秒的频率执行检测更改的回调
$（“#图像_链接”）。观察_字段（1，函数（）{
//警报（'观察到更改！新值：'+this.value）；
$（'#image_preview'）.attr（'src'，this.value）.show（）；
});
});

我的解决方案是修改

filemanager/js目录中的include.js文件。。（或include.min.js.

在dialog.php 246行中定义）

因此，在第500行的include.js文件中，您可以找到一个

函数apply\u img（文件，外部）

在函数末尾添加以下行：

 if (typeof **parent.**responsive_filemanager_callback == 'function')
    { parent.responsive_filemanager_callback(external);  } 

    }

---

“家长”是最重要的。。我想，这是因为iFrame的缘故。。因此，如果在html文档中添加.responsive_filemanager_回调函数，它将运行该函数

设法解决了问题。请按照以下代码操作：

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>

函数响应\u文件管理器\u回调（字段\u id）{
控制台日志（字段id）；
var url=jQuery（“#”+字段_id）.val（）；
//警报（“更新”+字段id+”和“+url”）；
//你的代码
$（'#image_preview'）.attr（'src'，document.getElementById（“image_link”）.value.show（）；
父项。$.fancybox.close（）；
} 

我使用fanybox打开和关闭弹出窗口

创建链接：

<a href='Address_Of_dialog.php?type=0&field_id=name'>open_fancybox</a>

然后，如果单击响应文件管理器中的任何图像，该图像的url将打印在输入字段上，fancybox将自动关闭

因此，从响应文件管理器中获取信息不需要任何功能，但如果您想在这之后执行任何操作（如预览所选图像），可以添加以下功能：

function responsive_filemanager_callback(field_id){ 
   //write whatever you want
   //you can change the src of an <img> using the <input> value
}

函数响应\u文件管理器\u回调（字段\u id）{
//你想写什么就写什么
//您可以使用该值更改的src
}

此功能将在选择图像并关闭fancybox后立即触发，因此非常方便且易于使用

如果您想获得文件的干净地址，可以向href地址添加relative_url=1，如下所示：

<a href='Address_Of_dialog.php?type=0&field_id=name&relative_url=1'>open_fancybox</a>

抱歉，回拨未启动。我分别设置了它。你知道怎么了吗？谢谢！非常感谢。将参数

字段\u id

传递到dialog.php解决了我的问题。这是最好的答案。

$('a').fancybox({
        type: 'iframe',
        minHeight: '600'
    });

function responsive_filemanager_callback(field_id){ 
   //write whatever you want
   //you can change the src of an <img> using the <input> value
}

<a href='Address_Of_dialog.php?type=0&field_id=name&relative_url=1'>open_fancybox</a>