1

所以,我是一名 java 开发人员,尽量不要在 javascript 中编写太多 java 代码。我已经阅读了有关 javascript 的各种资源(例如http://chimera.labs.oreilly.com/books/1234000000262/ch04.html),但我仍然无法找到一种简洁而好的方法来做到这一点。

所以,基本问题是:

  • 点击“删除”按钮(页面上会有很多删除按钮)
  • 打开引导模式对话框,这是一个下划线模板
  • 将动作绑定到按钮
  • 如果单击确定,则发出 ajax 请求

所以,这是一个到目前为止部分有效的解决方案。我在从 ajax 成功回调中调用函数时遇到问题。如果我尝试使用“this”,则说明上下文错误。我可能可以将它存储在另一个变量中(比如“那个”),但这肯定会那么好。

此外,考虑到我在上述书中读到的内容,我不太确定这段代码看起来那么好

function DeleteHandler() {
    var obj = {
        init: function () {
            _.bindAll(this, 'render', 'close', 'submit');

            this.$main = $('#main');
            // get underscore template
            this._template = _.template($('#delete-template').html());
            // bind function to delete button
            this.$main.on('click', '.delete', this.render);


        },
        render: function(e) {
            e.preventDefault();
            //render the template and bind button actions
            this.$content = $(this._template({title: 'moe'}));
            this.$content.on('click', '.ok', this.submit);
            this.$content.modal('show');
            this.$endpoint = $(e.target).attr('endpoint');
        },
        close: function () {
            this.$content.modal('hide');
        },
        submit: function() {
            $.ajax({
                url: this.$endpoint,
                type: 'DELETE',
                success: function(data,textStatus){
                    // call close function here! but how?!?

                },

            });
        }
    }
    return obj;
};

现在我可以使用这样的东西

<span class="delete" endpoint='http://....'>delete</span>   

<script type="text/javascript">

    $(function($) {
        DeleteHandler().init();
    });
</script>

如果我可以像这样调用我的函数,我会非常高兴:

DeleteHandler.init();

这可能吗?我将在页面上多次使用这个函数,所以我不能只使用文字而不是函数。

编辑: 我找到了某种解决方法来使 ajax 回调发生:您可以将上下文传递给 jquery ajax 文字:

如果我使用这样的东西:

$.ajax({
    url: this.$endpoint,
    type: 'DELETE',
    context: this,
    success: function(data,textStatus){this.$update.html(data); this.close();},
}

我实际上可以在成功回调中调用 this.close() 。可能不是一个很好的解决方案。但可能有人有更好的主意?

4

1 回答 1

1

您已经通过 DeleteHandler 函数将它包装在一个对象中(函数在技术上是对象)。而不是制作 var obj,您可以在 DeleteHandler 函数中声明一个 Init 函数并调用它...

function DeleteHandler() {
  // Declare the Init function inside our DeleteHandler object
  function Init() {do stuff...};

  // Declare your other functions and 'stuff'
  function render() {...};

  // Now call the function.
  Init();
};

至于创建和使用您的对象,它看起来更像这样:

<span class="delete" endpoint='http://....'>delete</span>   

<script type="text/javascript">

    $(function($) {
        DeleteHandler();
    });
</script>
于 2013-07-15T21:31:56.870 回答