Question

我正在尝试允许用户指定iframe的高度和宽度。我想允许他们输入一个高度和宽度，这些高度和宽度将填充那些可以复制和粘贴的字符串中的值。我不知道如何将该值传递给字符串。

<form id="embed-customize" action="/" style="display:block">
    <fieldset class="embed-size">
    <legend>Size:</legend>
    <div>
    <input id="embed-width" type="text" value="300">
    x
    <input id="embed-height" type="text" value="500">
    </div>
    </fieldset>

</form>
<textarea id="embed-url" rows="3" cols="100"></textarea>
<script>
jQuery(document).ready( function() {
var embedWidth = "";
var embedHeight = "";
var iframe = "";

jQuery('#embedWidth').blur(function(){
  embedWidth = jQuery(this).val();
})

var iframe = '<iframe width = ' + embedWidth + 'px height = ' + embedHeight +'px frameborder = "0" scrolling = "no" src = "http://www.example.com">"></iframe>';
jQuery('#embed-url').val(iframe);
})
</script>

这是我到目前为止所做的，但似乎没有用。我不确定我做错了什么。

Answer 1

试试这个：

jQuery('#embed-width').blur(function(){
  embedWidth = jQuery(this).val();
  var iframe = '<iframe width = ' + embedWidth + 'px height = ' + embedHeight +'px frameborder = "0" scrolling = "no" src = "http://www.example.com">"></iframe>';
  jQuery('#embed-url').val(iframe);
 });
})

Answer 2

给它一个镜头
http://jsfiddle.net/9zsqQ/

您的输入ID不一致。在HTML中，它是#embed-width，但在javascript中使用#embedWidth。

其次，您的iframe代码在属性名称和值之间有空格，而有些代码没有用双引号括起来。应该是这样的：

var iframe = '<iframe width="' + embedWidth + 'px" frameborder="0" scrolling="no" src="http://www.example.com">"></iframe>';

更新了jsfiddle，使其适用于两个输入：
http://jsfiddle.net/9zsqQ/2/

如何将输入值传递给字符串变量？

2 个答案: