Javascript 是否有一个弹出Jquery插件

Javascript 是否有一个弹出Jquery插件,javascript,jquery,html,Javascript,Jquery,Html,Hy, 我的图片很好地描述了我正在搜索的内容。它的ap弹出/模式框有2个选择选项…只能选择1个 我搜索的是一个带有不同选择选项的弹出窗口…可能在按钮中…或作为图片…我不想使用标准选择元素。。。 有没有什么好的例子…Codepen…Jquery插件可以很容易地解决这个问题 非常感谢这可以通过fancybox和jQuery来完成 我不确定我是否理解正确,但您正在寻找不使用的下拉列表,对吗?是的,我想用somting elseStick替换,并添加一些CSS来设置样式。是的,这是可能的。这样代码就更少

Hy, 我的图片很好地描述了我正在搜索的内容。它的ap弹出/模式框有2个选择选项…只能选择1个

我搜索的是一个带有不同选择选项的弹出窗口…可能在按钮中…或作为图片…我不想使用标准选择元素。。。 有没有什么好的例子…Codepen…Jquery插件可以很容易地解决这个问题


非常感谢

这可以通过fancybox和jQuery来完成


我不确定我是否理解正确,但您正在寻找不使用的下拉列表,对吗?是的,我想用somting elseStick替换,并添加一些CSS来设置样式。是的,这是可能的。这样代码就更少了。示例:否则,请使用jQuery,示例:当然可能,但我的选项有很长的文本,并且select元素不是我的最佳选项…Kevin P的答案将帮助我解决问题…谢谢Shappy的帮助。请您将此标记为已接受的答案,并让我知道您是否需要任何进一步的指导。再次感谢您……可能是有用的提示……添加jQuery.fancybox.close;$this.addClass'btn-success'之后;选择后将自动关闭fancybox:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.css"/>


<div style="display: none; width:500px;" id="hidden-content">

    <h2>Lightbox</h2>

    <a href="#" id="button-one" class="btn btn-lg btn-default select-btn" data-value="1">Select me 1</a>
    <a href="#" id="button-one" class="btn btn-lg btn-default select-btn" data-value="2">Select me 2</a>
</div>

<div class="container">


    <a data-fancybox data-src="#hidden-content" href="javascript:;" class="btn btn-lg btn-success">
        Open Lightbox
    </a>
    <p>
        Selected Value<br>
        <input type="text" name="selected_value" id="selected_value"/>
    </p>
</div>

<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.js"></script>

<script>
    $(function () {
        $('body').on('click', '.select-btn', function () {
            $selectBtn = $('.select-btn');
            $selectBtn.addClass('btn-default');

            $selectBtn.removeClass('btn-success');

            $(this).removeClass('btn-default');
            $(this).addClass('btn-success');

            $('#selected_value').val($(this).data('value'));
        })
    })
</script>