当第二个选择值更改时,选中第一个fancybox上的复选框

时间:2017-10-28 07:31:36

标签: jquery html fancybox

我有两个fancybox对话框,当我点击复选框标签时,在一个对话框中打开第二个对话框。

我想要的是第二个对话框,当选择值被更改,然后在第一个对话框复选框应该被选中。

我怎样才能做到这一点?

这是我尝试过的代码:

$("#fancybox-manual-c").click(function() {
    $.fancybox.open([{
        src : '<div class=\'col-md-3\'><div class="checkbox checkbox-success" onclick="javascript:get(this);">'+
'<input id="checkbox1" type="checkbox" class="styled" value="" onclick=""> '+
'<label for="checkbox1"><a data-fancybox-next class="button-next" href="#">ONE</a></label>'+
'</div></div>',
        type : 'html',
        smallBtn : true
   }]);
});

this.get = function(t){
     //$(t).find('input#checkbox1').attr('checked', true);
     $.fancybox.open([{
        src: '<div class="col-md-3"><div class="checkbox checkbox-success"><select onchange="\''+t+'\'.find(\'input#checkbox1\').attr(\'checked\', true);"><option value="Unclassified">False</option><option value="">true</option></select></div></div>',
        type : 'html',
        smallBtn : false
    }]);
}

请注意,我想像上面一样手动打开fancybox。

感谢任何帮助。感谢。

CodePen

1 个答案:

答案 0 :(得分:1)

使用内联JS代码是一种不好的做法。只需创建对象,绑定事件然后显示:

var $src = $('<div class="col-md-3"><div class="checkbox checkbox-success"><select><option value="0">False</option><option value="1">true</option></select></div></div>');

$src.find('select').on('change', function() {
  $('#checkbox1').prop('checked', this.value == 1 ? true : false);
});

$.fancybox.open({
  src  : $src,
  type : 'html',
  smallBtn : true,
  toolbar  : false
});

https://codepen.io/anon/pen/WXNLmX?editors=1010