React添加完整的html字符串到iframe,并显示jquery页面(iframe自适应高度)

需求:旧的jquery页面,需要引入到react中,用iframe引入,并且初始化jquery的一些数据,还要根据子内容来自适应iframe高度

  const contentIFrameRef = useRef<any>(null)

useEffect(() => {
        initdata()
    }, [])


   const initdata = async () => {
         const iframe: any = contentIFrameRef.current
        axios.get(`http://172.16.139.63:8300/customer-feedback/v1/comment-card/html/819E4007?format=json`).then((response) => {
            const data = response.data.Result.Html;
            const iframeDocument = iframe.contentWindow.document
            iframeDocument.open();
            iframeDocument.write(data);
            iframeDocument.close();
        })
        iframe.onload = function () {
            var someNewScript = document.createElement('script');
            var scriptUrl = document.createElement('script');
            scriptUrl.src = 'https://promotions.newegg.com/Newegg/Feedback/Scripts/custom-feedback.min.js?v=$ScriptVersion';
            someNewScript.innerText = `jQuery("input[name='186_NoType_141']").val("123");jQuery("input[name='198_NoType_171']").val("qwe");`;
            iframe.contentWindow.document.getElementsByClassName('form-cells')[0].appendChild(someNewScript);
            iframe.contentWindow.document.getElementsByTagName('head')[0].appendChild(scriptUrl);
            var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
            iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight;
        };
    }

  <iframe ref={contentIFrameRef} width='100%'/>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 前端开发面试题 面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。 题目类型: 理论知...
    怡宝丶阅读 7,414评论 0 7
  • 前端开发面试题 <a name='preface'>前言</a> 只看问题点这里 看全部问题和答案点这里 本文由我...
    自you是敏感词阅读 4,274评论 0 3
  • <a name='html'>HTML</a> Doctype作用?标准模式与兼容模式各有什么区别? (1)、<...
    clark124阅读 9,055评论 1 19
  • 1、JS的数据类型只有浮点型,没有整型。null,underfined,boolean,number,string...
    6e5e50574d74阅读 6,963评论 2 1
  • 今天感恩节哎,感谢一直在我身边的亲朋好友。感恩相遇!感恩不离不弃。 中午开了第一次的党会,身份的转变要...
    余生动听阅读 13,602评论 0 11

友情链接更多精彩内容