Триггер colorbox при использовании выпадающего - PullRequest
Новая
       28

Триггер colorbox при использовании выпадающего

2 голосов
/ 19 декабря 2011

Я пытаюсь наложить отдельные элементы div с информацией профиля, используя colorbox, когда кто-то выбирает имя из выпадающего списка.Итак, если кто-то нажмет на «Имя 1», значение которого в моем раскрывающемся списке равно # p01, то div с идентификатором # p01 будет отображаться с помощью colorbox.

Однако я не могузаставить это работать.Может ли кто-нибудь увидеть в моем коде что-нибудь, что может вызвать проблему?

Большое спасибо,

Осу

HTML

Форма: 

<form action="" method="post" id="chooseprofile">
    <select name="profiledd" id="profiledd">
        <option value="" selected="yes">- Please select -</option>
        <option value="#p01">Name 1</option>
        <option value="#p10">Name 2</option>
        ...
    </select>
</form>

Наложения Div: 

<div style="display:none;">
    <div id="p01" class="profile">
        <img src="#" />
        <div class="profdesc">
            ...content...
        </div> <!-- End div.profdesc -->
        <div class="clear">&nbsp;</div>
    </div>
</div> <!-- End div#p01 -->

<div style="display:none;">
    <div id="p10" class="profile">
        <img src="#" />
        <div class="profdesc">
            ...content...
        </div> <!-- End div.profdesc -->
        <div class="clear">&nbsp;</div>
    </div>
</div> <!-- End div#p10 -->
...etc.

JQUERY 

$("#profiledd").change(function() { 
    var currentProfile = $(this).val(); // Grab select value and show correct overlay:
    $(currentProfile).colorbox({
        inline:true,
        current: '',
        innerWidth:"700px",
        innerHeight:"400px",
        transition:"fade"
    });
});

Ответы [ 3 ]

0 голосов
/ 19 декабря 2011

Попробуйте: 

$("#profiledd").change(function() { 
    var currentProfile = $(this).val(); // Grab select value and show correct overlay:
     $(this).colorbox({
        inline:true,
        current: '',
        innerWidth:"700px",
        innerHeight:"400px",
        transition:"fade"
    });
});
0 голосов
/ 20 декабря 2011

Нашел проблему!Это код, который необходим - обратите внимание на часть $.colorbox({ - вы можете прочитать больше на странице Public Methods на странице проекта Colorbox здесь: http://jacklmoore.com/colorbox/.

Спасибо за ваш вклад MMR и Sudhir: 

$("#profiledd").change(function() { 
        var currentProfile = $(this).val(); // Grab select value and show overlay : 
        $.colorbox({
            inline:true,
            href:currentProfile,
            current: '',
            innerWidth:"700px",
            innerHeight:"400px",
            transition:"fade"
        });
    });
0 голосов
/ 19 декабря 2011

Если Jquery появляется, проверьте, нет ли конфликта Jquery ...

Чтобы проверить это, выполните простой тест jquery, например alert ($ ('body'). Html ());

и посмотрите, работает ли он.

и, возможно, попробуйте inline: 'true' (с кавычками)

...