【问题标题】:How to call a jQuery Colorbox pop up on the onchange event of select HTML control?如何在选择 HTML 控件的 onchange 事件上调用 jQuery Colorbox 弹出?
【发布时间】:2013-10-19 04:56:11
【问题描述】:

以下是我的代码 sn-p:

    <select  name="select_option">
      <option value="0">--Select Action--</option>
      <option value="1" class="delete_bulk_tests">Delete User</option>
      <option value="2" class="disable_bulk_tests">Disable User</option>
    </select>
    <div class="hidden">
      <div id="deletePopContent" class="c-popup">
        <h2 class="c-popup-header">Delete Users</h2>
        <div class="c-content">         
          <h3>Are you sure to delete selected users?</h3>
          <p class="alert"><strong>You are about to perform an action which can't be undone</strong></p>
          <a href="#"class="c-btn">No</a><a href="#"class="c-btn" id="delete_url">Delete</a> 
        </div>
      </div>
    </div>
<div class="hidden">
      <div id="disablePopContent" class="c-popup">
        <h2 class="c-popup-header">Disable Users</h2>
        <div class="c-content">         
          <h3>Are you sure to disable selected users?</h3>
          <p class="alert"><strong>You are about to perform an action which can't be undone</strong></p>
          <a href="#"class="c-btn">No</a><a href="#"class="c-btn" id="disable_url">Disable</a> 
        </div>
      </div>
    </div>

    $(document).ready(function()  {
    $(".delete_bulk_tests").onchange(function(e) { 
        $(".delete_bulk_tests").colorbox({inline:true, width:666});

    });

$(".disable_bulk_tests").onchange(function(e) { 
        $(".disable_bulk_tests").colorbox({inline:true, width:666});

    });
  });

我想在选择相关选项时显示相应的颜色框。我按照上面的方法进行了尝试,但无法调用 ID 为 deletePopContentdisablePopContent 的 Colorbox。我已经包含了所有必要的库,并且萤火虫控制台中也没有错误或警告。任何人都可以帮助我显示颜色框吗?提前致谢。

【问题讨论】:

    标签: javascript jquery select colorbox onchange


    【解决方案1】:

    使用下面的代码:

    $(document).ready(function()  {
        $(".delete_bulk_tests").change(function(e) { 
            $(this).colorbox({inline:true, width:666});
    
        });
    
    $(".disable_bulk_tests").change(function(e) { 
            $(this).colorbox({inline:true, width:666});
    
        });
      });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-10-22
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多