0

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);
    });
});

これはテキストエリア内では機能しませんが、まったく同じコードがページの iframe 要素自体で機能します (ID を配置すると)。

また、ユーザーがテキスト領域をクリックしたときにテキスト全体をマークする簡単な方法はありますか?

4

1 に答える 1

0

テキスト領域内の 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

もう 1 つの方法は、文字列の部分文字列と indexOf を使用するように、単に「幅」を見つけて置き換えることです。または、幅属性の代わりに {0} を使用して、隠し入力の値として iframe テキストを使用することもできます。いつでもグラブして置換を実行し、テキストエリアに貼り付けることができます

于 2012-11-07T09:39:24.490 に答える