Для закрытия диалогового окна подтверждения Javascript требуется три нажатия кнопки «Отмена». - PullRequest
4 голосов
/ 29 июля 2010

Следующий код виновен в создании этой необычной проблемы:

<script type="text/javascript">
                $(document).ready(function () {
                    $('.deleteRow').click(function (event) {
                        event.preventDefault();
                        if (confirm('Delete?')) {
                            var $t = $(this);
                            $.post($(this).attr('href'), function (data) {
                                if (data) {
                                    $t.parent().parent().remove();
                                }
                            });
                        }
                        return false;
                    });
                });
            </script>

Заранее спасибо!

Вот HTML:

<td> <%= Html.ActionLink("<-Delete", "Delete", new {quoteID = quote.QuoteID}, new {@class= "deleteRow"}) %></td>

<td> <a class="deleteRow" href="/Quote/Delete/56">&lt;-Delete</a></td>

Вот и мы.

    <tbody>

        <tr>
            <td>
                <p>
    asd</p>
&lt;div firebugversion=&quot;1.5.4&quot; id=&quot;_firebugConsole&quot; style=&quot;display: none;&quot;&gt;

    &amp;nbsp;&lt;/div&gt;
&lt;br /&gt;

            </td>
            <td>
                2345
            </td>
            <td>
                7/28/2010 3:26:10 PM
            </td>

            <td> <a class="deleteRow" href="/Quote/Delete/56">&lt;-Delete</a></td>
            <script type="text/javascript">
                $(document).ready(function () {
                    $('.deleteRow').click(function (event) {
                        event.preventDefault();
                        event.stopPropagation();
                        if (confirm('Delete?')) {
                            var $t = $(this);
                            $.post($(this).attr('href'), function (data) {
                                if (data) {
                                    $t.parent().parent().remove();
                                }
                            });
                        }
                        return false;
                    });
                });
            </script>

        </tr>

        <tr>
            <td>
                Now is the time for all good men to come to the aid of their parties.
            </td>

            <td>

            </td>
            <td>
                7/6/2010 10:13:44 PM
            </td>
            <td> <a class="deleteRow" href="/Quote/Delete/2">&lt;-Delete</a></td>
            <script type="text/javascript">
                $(document).ready(function () {
                    $('.deleteRow').click(function (event) {
                        event.preventDefault();
                        event.stopPropagation();
                        if (confirm('Delete?')) {
                            var $t = $(this);
                            $.post($(this).attr('href'), function (data) {
                                if (data) {
                                    $t.parent().parent().remove();
                                }
                            });
                        }
                        return false;
                    });
                });
            </script>

        </tr>

        <tr>
            <td>
                I&#39;m a loser
            </td>
            <td>
                146
            </td>
            <td>

                7/6/2010 9:11:42 PM
            </td>
            <td> <a class="deleteRow" href="/Quote/Delete/1">&lt;-Delete</a></td>
            <script type="text/javascript">
                $(document).ready(function () {
                    $('.deleteRow').click(function (event) {
                        event.preventDefault();
                        event.stopPropagation();
                        if (confirm('Delete?')) {
                            var $t = $(this);
                            $.post($(this).attr('href'), function (data) {
                                if (data) {
                                    $t.parent().parent().remove();
                                }
                            });
                        }
                        return false;
                    });
                });
            </script>

        </tr>

    </tbody>

Спасибо за все ответы, кстати.

Ответы [ 3 ]

7 голосов
/ 29 июля 2010

Теперь, когда вы разместили сгенерированный HTML, ясно, что вы поместили вывод jQuery в цикл, который генерирует ваши TD-элементы.Он должен выходить за пределы этого цикла, предпочтительно внизу страницы!

Если вы посмотрите на HTML, вы увидите это 3 раза:

<script type="text/javascript">
                $(document).ready(function () {
                    $('.deleteRow').click(function (event) {
                        event.preventDefault();
                        event.stopPropagation();
                        if (confirm('Delete?')) {
                            var $t = $(this);
                            $.post($(this).attr('href'), function (data) {
                                if (data) {
                                    $t.parent().parent().remove();
                                }
                            });
                        }
                        return false;
                    });
                });
            </script>

Теперь вы может сказать: "Да, он определен три раза, но не должен ли он все же выполняться один раз? В конце концов, я перераспределяю обработчик кликов!"Ну нет.Метод jQuery .click () привязывает функцию к определенному событию, добавляя эту функцию в список eventListeners для этого события.Так обычно работает привязка событий в Javascript.Привязка означает добавить его в список.

Если вы хотите убедиться, что добавляемый вами обработчик щелчков является ЕДИНСТВЕННЫМ обработчиком щелчков для элемента, вам нужно сначала использовать unbind :

 $('.deleteRow').unbind('click').click(function (event) { // rest of code...

вместо этого:

 $('.deleteRow').click(function (event) { // rest of code...
2 голосов
/ 29 июля 2010

BINGO ~ вам нужно только один раз вызвать механизм связывания событий!

вы делаете это три раза.

внизу страницы должен быть только один блок сценария

Также:

когда вы делаете это:

$t = $(this);

, этот запрос теперь хранится в $ t, так что вы можете использовать его повторно.

$.post($(this).attr('href'), function (data) {

может просто использовать сохраненныйнабор результатов

$.post($t.attr('href'), function (data) {

Удачи.

1 голос
/ 29 июля 2010

Я создал эту тестовую страницу, используя предоставленную вами информацию.Это не демонстрирует это поведение.(Я добавил TR, но это не имеет значения - раньше тоже работало нормально).

Чем отличается ваша собственная тестовая страница от этого примера?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...