Question

我想要简化以下代码。使用javascript和jQuery有一种简单的方法可以将这两个函数结合起来吗？大多数代码是相同的，但我不知道如何创建一个单独的功能，取决于点击的内容。

$(document).ready(function () {
    $('#ListBooks').click(ListBooks);
    $('#Create').click(Create);
});

function Create() {
    var dataSourceID = $('#DataSourceID').val();
    var subjectID = $('#SubjectID').val();
    var contentID = $('#ContentID').val();
    if (dataSourceID && dataSourceID != '00' && 
        subjectID && subjectID != "00" &&
        contentID && contentID != "00")
    {
        var e = encodeURIComponent,
            arr = ["dataSourceID=" + e(dataSourceID),
                   "subjectID=" + e(subjectID),
                   "contentID=" + e(contentID)];
        window.location.href = '/Administration/Books/Create?' + arr.join("&");
    } else {
        alert('Datasource, Subject and Content must be selected.');
    }
    return false;
}

function ListBooks() {
    var dataSourceID = $('#DataSourceID').val();
    var subjectID = $('#SubjectID').val();
    var contentID = $('#ContentID').val();
    if (dataSourceID && dataSourceID != '00' &&
        subjectID && subjectID != "00" &&
        contentID && contentID != "00") {
        var e = encodeURIComponent,
            arr = ["dataSourceID=" + e(dataSourceID),
                   "subjectID=" + e(subjectID),
                   "contentID=" + e(contentID)];
        window.location.href = '/Administration/Books/ListBooks?' + arr.join("&");
    } else {
        alert('Datasource, Subject and Content must be selected.');
    }
    return false;
}

Answer 1

那样的东西？

$(document).ready(function () {
    $('#ListBooks').click(function() { yourNewFunction('ListBooks'); });
    $('#Create').click(function() { yourNewFunction('Create'); });
});

yourNewFunction(type) {
  // code of both functions
  if ('ListBooks' == type) {
   // code for ListBook
  } else {
   // code for Create
  }
};

Answer 2

我尝试将您的两个函数合并为一个事件触发器。

看看这是否有帮助，如果我错过任何其他（两个代码都不常见）位，我可以帮你编辑它。

$(document).ready(function () {
    $('#ListBooks').unbind('click').bind('click', function() {
        iClicked("list");
    });
    $('#Create').unbind('click').bind('click', function() {
        iClicked("create");
    });
});

var url_map = {
    'create':'/Administration/Books/Create',
    'list':'/Administration/Books/ListBooks'
};

function iClicked(trig) {
    if (!url_map[trig]) {
        alert("Unsupported event");
        return false;
    }
    var dataSourceID = $('#DataSourceID').val();
    var subjectID = $('#SubjectID').val();
    var contentID = $('#ContentID').val();
    if (dataSourceID && dataSourceID != '00' &&
        subjectID && subjectID != "00" &&
        contentID && contentID != "00")
    {
        var e = encodeURIComponent,
            arr = ["dataSourceID=" + e(dataSourceID),
                   "subjectID=" + e(subjectID),
                   "contentID=" + e(contentID)];
        window.location.href = url_map[trig] + '?' + arr.join("&");
    } else {
        alert('Datasource, Subject and Content must be selected.');
    }
    return false;
}

Answer 3

您需要的是根据您在$('#ListBooks')和$('#Create')中传递的ID，使函数执行不同的操作。因此，不是将id硬编码到函数中，而是使用this.id来反转值。调整此行：

$('#ListBooks').click(combinedFunction);

和这个

window.location.href = '/Administration/Books/'+ this.id + '?' + arr.join("&");

最终代码：

$(document).ready(function () {
    $('#ListBooks').click(combinedFunction);
    $('#Create').click(combinedFunction);
});

function combinedFunction() {
    var divId = this.id;
    var dataSourceID = $('#DataSourceID').val();
    var subjectID = $('#SubjectID').val();
    var contentID = $('#ContentID').val();
    if (dataSourceID && dataSourceID != '00' && 
        subjectID && subjectID != "00" &&
        contentID && contentID != "00")
    {
        var e = encodeURIComponent,
            arr = ["dataSourceID=" + e(dataSourceID),
                   "subjectID=" + e(subjectID),
                   "contentID=" + e(contentID)];
        //Use this.id to retrive the value
        window.location.href = '/Administration/Books/'+ this.id + '?' + arr.join("&");
    } else {
        alert('Datasource, Subject and Content must be selected.');
    }
    return false;
}

Answer 4

function doBookAction(action) {
    var dataSourceID = $('#DataSourceID').val();
    var subjectID = $('#SubjectID').val();
    var contentID = $('#ContentID').val();
    if (dataSourceID && dataSourceID != '00' &&
        subjectID && subjectID != "00" &&
        contentID && contentID != "00") {
        var e = encodeURIComponent,
            arr = ["dataSourceID=" + e(dataSourceID),
               "subjectID=" + e(subjectID),
               "contentID=" + e(contentID)];
        window.location.href = '/Administration/Books/' + action + '?' + arr.join("&");
    } else {
        alert('Datasource, Subject and Content must be selected.');
    }
    return false;
} 

$('#ListBooks,#Create').click(function() { doBookAction($(this).attr('id')); });

我可以使用Javascript将两个函数合并为一个吗？

4 个答案: