Sweetalert: ์„ฑ๊ณต ๋ชจ๋‹ฌ์— ์—ฌ๋Ÿฌ ๋ฒ„ํŠผ์„ ์ถ”๊ฐ€ํ•˜๊ธฐ ์œ„ํ•ด ์ˆ˜์ •ํ•˜๋Š” ๋ฐฉ๋ฒ•๊ณผ ์œ„์น˜

์— ๋งŒ๋“  2016๋…„ 01์›” 12์ผ  ยท  4์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: t4t5/sweetalert

์ด๋ด
์„ฑ๊ณต ๋ชจ๋‹ฌ์—์„œ ์‚ฌ์šฉ์ž์—๊ฒŒ ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์•Œ๋ ค์ฃผ๋Š” ๋ช‡ ๊ฐ€์ง€ ๋ฒ„ํŠผ์„ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์ด ์žˆ๋Š”์ง€ ๊ถ๊ธˆํ•ฉ๋‹ˆ๋‹ค.

'์ด๋ด, ์ผ์„ ์„ฑ๊ณต์ ์œผ๋กœ ๋งˆ์ณค์–ด'
'์ด์ œ ์•„๋ž˜ ์ค‘ ํ•˜๋‚˜๋ฅผ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.'
"์˜ต์…˜1-๋งํฌ" "์˜ต์…˜2-๋งํฌ" "์˜ต์…˜3-๋งํฌ"

๋‚˜๋Š” ์ด์ œ ์ด๊ฒƒ์ด ํ”Œ๋Ÿฌ๊ทธ์ธ์˜ ์šฉ๋„๊ฐ€ ์•„๋‹ˆ์ง€๋งŒ {text:'', link:''} ์ปฌ๋ ‰์…˜๊ณผ ๊ฐ™์€ jsn์„ ์ˆ˜๋ฝํ•˜๊ณ  ๊ทธ์— ๋”ฐ๋ผ ๋ฒ„ํŠผ์„ ๋ Œ๋”๋งํ•˜๊ธฐ ์‹œ์ž‘ํ•˜๋„๋ก ์ด ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ์กฐ์ •ํ•ด์•ผ ํ•œ๋‹ค๋ฉด... ์–ด๋””์„œ๋ถ€ํ„ฐ ์‹œ์ž‘ํ• ๊นŒ์š”? ์™€ ํ•จ๊ป˜ ?

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

์กฐ๊ธˆ ๋Šฆ์„ ์ˆ˜๋„ ์žˆ์ง€๋งŒ ๋„์›€์ด ๋˜์—ˆ์œผ๋ฉด ํ•ฉ๋‹ˆ๋‹ค.

https://github.com/andrew-metas/swalExtend/tree/master

๋ชจ๋“  4 ๋Œ“๊ธ€

AFAIK, ๋‹น์‹ ์€ ํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค. ๋‘ ๊ฐœ์˜ ๋ฒ„ํŠผ ์‹œ์Šคํ…œ์€ ์Šคํฌ๋ฆฝํŠธ ์ „์ฒด์— ํ•˜๋“œ์ฝ”๋”ฉ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ์ž‘๋™ํ•˜๋ ค๋ฉด ์ƒ๋‹นํ•œ ์–‘์˜ ๋ณ€๊ฒฝ์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ํ•  ์ˆ˜ ์žˆ๋Š” ์ผ์€ html ์˜ต์…˜์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ชจ๋‹ฌ ๋ณธ๋ฌธ์— ๊ณ ์œ ํ•œ ๋ฒ„ํŠผ์„ ์ถ”๊ฐ€ํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค.

๋‚˜๋Š” ์ด๊ฒƒ์„ ์ž‘๋™ ์‹œ์ผฐ๊ณ  ์ผ๋ถ€ ์ž๋ฐ” ์Šคํฌ๋ฆฝํŠธ๋Š” ์˜ฌ๋ฐ”๋ฅด๊ฒŒํ•ด์•ผํ–ˆ์ง€๋งŒ ์˜ฌ๋ฐ”๋ฅธ ๋ฐฉ๋ฒ•์ด ์•„๋‹ ์ˆ˜๋„ ์žˆ์ง€๋งŒ ๋‚˜๋ฅผ ์œ„ํ•ด ์ผํ–ˆ์Šต๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์—์„œ ๊ณต์œ 

if (buttons) {
            var className = ".sweet-alert";
            var container = "<div class='sw-btn-container'><div class='buttons'></div></div>";
            $(className).after("h2").append(container);
            var buttonDiv = ".sweet-alert .buttons";
            _.each(buttons, function (item) {
                if (item.url) {
                    $(buttonDiv).append("<a class='confirm' href='" + item.url + "'>" + item.text + "</a>");
                } else if (item.onclick) {
                    $(buttonDiv).append("<a class='confirm' onclick='" + item.onclick + "'>" + item.text + "</a>");
                }
            });
        }

์กฐ๊ธˆ ๋Šฆ์„ ์ˆ˜๋„ ์žˆ์ง€๋งŒ ๋„์›€์ด ๋˜์—ˆ์œผ๋ฉด ํ•ฉ๋‹ˆ๋‹ค.

https://github.com/andrew-metas/swalExtend/tree/master

๊ทธ ํ”Œ๋Ÿฌ๊ทธ์ธ์€ ์ œ๊ฐ€ ํ•„์š”๋กœ ํ–ˆ๋˜ ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ •๋ณด ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. :D

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰

๊ด€๋ จ ๋ฌธ์ œ

rafatux picture rafatux  ยท  5์ฝ”๋ฉ˜ํŠธ

mateuszjarzewski picture mateuszjarzewski  ยท  4์ฝ”๋ฉ˜ํŠธ

rapeflower picture rapeflower  ยท  4์ฝ”๋ฉ˜ํŠธ

VoxelNaut picture VoxelNaut  ยท  6์ฝ”๋ฉ˜ํŠธ

Untit1ed picture Untit1ed  ยท  5์ฝ”๋ฉ˜ํŠธ