Question

从youtube嵌入电影时，您可以更改iframe元素的宽度和高度。当您输入所需的值时，您会看到texarea中的html代码已更改，因此用户只需复制粘贴。

你是如何实现这一目标的？

这就是我的尝试：

<input type="text" id="width">

<textarea id="code">
    <iframe src="..." width="224" height="144" frameborder="0" id="embed-widget"></iframe>
</textarea>

<script>
$(function() {
    $('#width').keyup(function(){
        var new_width = $(this).val();
        $('#embed-widget').attr('width',new_width);
    });
});

这在textarea中不起作用，但完全相同的代码在页面上的iframe元素本身上工作（当我把id放到它上面时）

此外，还有一种简单的方法可以在用户点击文本区域时标记整个文本吗？

Answer 1

文本区域内的iframe元素无法访问，它不是真实的，请尝试记录$（“＃embed-widget”）并获得一个空数组.... 您需要做的是在更改iframe元素的宽度后，获取html并将textarea文本设置为该html

$("#myiframe").width(new_width);
$("mytexteare").val($("#myiframe").parent().html());// make sure a parent div contains the iframe only

另一种方法是找到“width”并替换它，就像使用string的substring和indexOf一样，或者你可以将iframe文本作为隐藏输入的值，用{0}代替宽度属性，所以你可以随时抓取，并执行替换，然后粘贴textarea

设置为/ youtube嵌入iframe的高度

1 个答案: