<input id="embed-code" size="60" />
<h3>Select size:</h3>
<ul id="embed-size-options">
<li><a href="#" data-width="640" data-height="480" class="selected">640x480</a></li>
<li><a href="#" data-width="800" data-height="600">800x600</a></li>
<li><a href="#" data-width="1024" data-height="768">1024x768</a></li>
</ul>
<h3>Select color:</h3>
<ul id="embed-color-options">
<li><a href="#" data-color="#ff0000" class="selected">red</a></li>
<li><a href="#" data-color="#00ff00">green</a></li>
<li><a href="#" data-color="#0000ff">blue</a></li>
</ul>
<script src="jquery-1.4.2.min.js"></script>
<script src="sprintf-0.6.js"></script>
<script>
$(function() {
var $embed_code = $('#embed-code'),
$embed_size_options = $('#embed-size-options'),
$embed_color_options = $('#embed-color-options'),
$selected_size = $embed_size_options.find('a.selected').eq(0),
$selected_color = $embed_color_options.find('a.selected').eq(0),
code_tpl = 'current width %s and height %s and color %s';
if (!$selected_size) {
$selected_size = $embed_size_options.find('a').eq(0).addClass('selected');
}
if (!$selected_color) {
$selected_color = $embed_color_options.find('a').eq(0).addClass('selected');
}
generate_embed_code();
$embed_size_options.find('a').click(function() {
$selected_size.removeClass('selected');
$selected_size = $(this).addClass('selected');
generate_embed_code();
return false;
});
$embed_color_options.find('a').click(function() {
$selected_color.removeClass('selected');
$selected_color = $(this).addClass('selected');
generate_embed_code();
return false;
});
function generate_embed_code() {
$embed_code.val(sprintf(code_tpl, $selected_size.attr('data-width'), $selected_size.attr('data-height'), $selected_color.attr('data-color')));
}
});
</script>
这就是你想要的吗?
(我用过
this JavaScript sprintf() implementation
生成嵌入代码)