JqueryUI - Dialog多次打开

时间:2016-09-30 14:12:34

标签: javascript jquery jquery-ui

当我重新按#btn3时出现问题。之后,当我使用#button_create_product对话窗口打开对话框时,重复次数与按下#btn3的次数相同。 button_create_product中描述的products.jsp PS $('#button_create_product').unbind("click")没有帮助

  $('#btn3').click(function () {
            $('#menu').load("products.jsp",function () {
                $('#button_create_product').click( function() {
                    $('.dialog_create_product').dialog('open');

                });
                $( ".dialog_create_product" ).dialog({
                    autoOpen: false,
                    width: 800,
                    buttons: {
                        OK: function() {
                            $(".dialog_create_product").dialog("close")

                        },
                        CANSEL: function() {
                            $(".dialog_create_product").dialog("close")
                        }
                    },
                });
            });
        });

HTML

    <body class="products">

<button id = "button" class="remove">Удалить выделенное</button>
<button id = "button_create_product" class="button_create_product">Добавить продукт</button>

<hr>
<table id="products_table" class="display" cellspacing="0" width="100%">
    <thead>
    <tr>
        <th>id</th>
        <th>Категория</th>
        <th>Производитель</th>
        <th>Название</th>
        <th>Штрихкод</th>
        <th></th>
        <th></th>
    </tr>
    </thead>
    <tfoot>
    <tr>
        <th>id</th>
        <th class="searchable">Каталог</th>
        <th class="searchable">Производитель</th>
        <th class="searchable">Название</th>
        <th class="searchable">Штрихкод</th>
        <th></th>
        <th></th>
    </tr>
    </tfoot>
    <tbody>
    </tbody>
</table>

<div class="dialog_create_product" title="Создать продукт" hidden>
    <table align="center" border="0" cellpadding="5" cellspacing="0" style="width: 70%">
        <tbody>
        <tr>
            <td>
                <select class="selectCategory" style="width: 100%">
                </select>
            </td>
        </tr>
        <tr>
            <td><input class="prodName" placeholder="Название" type="text" style="width:  100%" maxlength="50"></td>
        </tr>
        <tr>
            <td><input class="prodProvider" placeholder="Производитель" type="text" style="width:  100%" maxlength="50"></td>
        </tr>
        <tr>
            <td><input class="prodCode" placeholder="штрих-код" type="text" style="width:  100%" maxlength="50"></td>
        </tr>
        </tbody>
    </table>
    <table class="sostav" align="center" border="0" cellpadding="2" cellspacing="2" style="width: 700px">
        <tbody>
        <tr>
            <td width="50%" align="center"><b>Компоненты</b><hr></td>
            <td width="50%" align="center"><b>Состав</b><hr></td>
        </tr>
        <tr>
            <td class = "components"  height="200px" valign="top"></td>
            <td class = "compound"  height="200px" valign="top"></td>
        </tr>
        </tbody>
    </table>
    <div class="divInput"align="center">
        <input class = "getInputComponent" placeholder="название компонента" type="text" maxlength="50"><button class="addComponent" >Добавить компонент</button>
    </div>

</div>
</body>

2 个答案:

答案 0 :(得分:0)

请试试这个。这将阻止您的额外事件解雇。

$(".btn3").click(function(event) {
  event.stopImmediatePropagation();
  //Do Stuff
});

答案 1 :(得分:0)

每次点击#!/bin/bash # make variables available in function started by # gnu semaphore export FINALRES="result.log" export RESFIFO="/tmp/res.fifo" export FILFIFO="/tmp/fil.fifo" export FILELIST="/tmp/flist" export WPSIZE=5 export JOBS=4 PUTFPID="" WRITPID="" # find input files fo process find . -name "*.txt" > ${FILELIST} # setup fifos and files [ ! -e "${FINALRES}" ] && touch "${FINALRES}" [ ! -e "${RESFIFO}" ] && mkfifo "${RESFIFO}" [ ! -e "${FILFIFO}" ] && mkfifo "${FILFIFO}" FILES=$(diff ${FINALRES} ${FILELIST} | grep '>' | cut -d '>' -f2 | tr -d ' ') exec 4<> ${RESFIFO} exec 5<> ${FILFIFO} trap cleanup EXIT TERM function cleanup() { # write results that have been obainted so far echo "cleanup" [ -n "${PUTFPID}" ] && (kill -9 ${PUTFPID} 2>&1) > /dev/null [ -n "${WRITPID}" ] && (kill -9 ${WRITPID} 2>&1) > /dev/null rm -f "${RESFIFO}" rm -f "${FILFIFO}" rm -f "${LOCKFILE}" } # this function takes always #WPSIZE (or less) files from the fifo function readf() { local cnt=0 while read -r -t 2 line; do echo "$line" [ -z "${files}" ] && { files=${line}; let cnt=${cnt}+1; continue; } let cnt=${cnt}+1 [ ${cnt} -eq ${WPSIZE} ] && break done <& 5 } # this function is called by gnu semaphore and executed in the background function worker () { for fil in "${@}"; do # do something ... echo "result" > "${RESFIFO}" done exit 0 } # this function is used (at the end) to write the comutation results to a file function writeresult() { while read -r line; do [ "${line}" = "quit" ] && break echo "${line}" >> ${FINALRES} done < ${RESFIFO} } # this simple helper puts all input files into a fifo function putf() { for fil in $FILES; do echo "${fil}" > "${FILFIFO}" done } # make function worker known to gnu semaphore export -f worker # put file into fifo putf & PUTFPID=$! writeresult & WRITPID=$! while true; do ARGS=$(readf) [ -z "${ARGS}" ] && break # used word spitting on purpose here (call worker with multiple params) sem --bg --jobs "${JOBS}" worker ${ARGS} done sem --wait echo "quit" > ${RESFIFO} wait echo "all jobs are finished" exit 0 时,另一个#btn处理程序都会click。因此,当您单击#button_create_product时,该处理程序将多次运行。

#button_create_product代码从回调函数中取出,并在加载页面时执行一次。使用变量来跟踪是否已单击该按钮。

$('#button_create_product').click