Question

我正在尝试预填充插入到页面中的外部小部件的值。

根据小部件的文档，可以手动创建具有预填充值的特定小部件，但是由于我可以拥有数百个可能的值，因此这将非常耗时且不可扩展。

因此，我正在尝试使用Javascript或jQuery来实现。

插入外部窗口小部件后，其html如下所示：

<ins class="bookingaff" ...>
    <iframe src="...>

        #document
        <!doctype html>
        <html>
            ...
            <form id="..." ...>
                ...
                <input class="searchbox__inp ..." type="search" id="b_destination" name="ss" value="" ...">

            </form>

        </html>

     </iframe>
</ins>

我尝试了几件事，但没有任何效果。这是一个示例：

<script>

  var widgetDOMs = document.getElementsByClassName('bookingaff');
  var widgetDOM = widgetDOMs[0]
  console.log('widgetDOM:', widgetDOM); //until here OK, element found. Console is showing the tree structure written above

  //with javascript
  var innerDoc = widgetDOM.getElementsByClassName('searchbox__inp');
  console.log('innerDoc:', innerDoc); // innerDoc: HTMLCollection []

  //with jQuery
  var innerDoc = $(widgetDOM).find('.searchbox__inp');
  console.log('innerDoc:', innerDoc); // length of innerDoc element is 0

  //once the elements inside the document widgetDOM can be accessed, I guess adding the value to the form would be straightforward...

</script>

无论我做什么，我都无法访问用iframe插入的文档中的任何元素。我该怎么办？

使用Javascript / jQuery以iframe形式预填充值

0 个答案: