Question

所以我有一个带文本

的复选框和textarea

<input type="checkbox" value="" class="responsive" checked="checked"> Responsive?<br />
<textarea cols="40" rows="5" placeholder="<?php echo $entry_code; ?>" id="input-code" class="form-control afftextie"><div class="intrinsic-container"><iframe src="content.php" style="overflow: hidden;border:none;width:1000px;height:400px" scrolling="no""></iframe></div></textarea>

现在，我在点击复选框时尝试追加和额外的文字/代码，并在取消选中时删除。

var $input = $( '.afftextie' ).text();
$( ".responsive" ).change(function() {  
$( '.afftextie' ).appennd($input+'<style>.intrinsic-container{position:relative;overflow:hidden;min-height:400px;margin-bottom:10px}.intrinsic-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}@media (max-width:990px){.intrinsic-container{min-height:1151px}}@media (max-width:510px){.intrinsic-container{min-height:1570px}}</style>').text()}).change();

演示：https://jsfiddle.net/wr39vhjt/2/

Answer 1

我编辑你的小提琴。 https://jsfiddle.net/ebilgin/wr39vhjt/3/

您必须稍微更改一下代码。首先，您可以使用textarea而不是.val()到达.append()。然后你需要一个检查条件。

var $input = $( '.afftextie' ).text();
$( ".responsive" ).change(function() {

    if ( $(this).prop("checked") ) {

        $( '.afftextie' ).append($input+'<style>.intrinsic-container{position:relative;overflow:hidden;min-height:400px;margin-bottom:10px}.intrinsic-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}@media (max-width:990px){.intrinsic-container{min-height:1151px}}@media (max-width:510px){.intrinsic-container{min-height:1570px}}</style><div class="intrinsic-container"><iframe src="content.php" style="overflow: hidden;border:none;width:1000px;height:400px" scrolling="no""></iframe></div>').text()

    } else {

        $( '.afftextie' ).html("");

    }
}).change();

jQuery使用复选框

1 个答案: