Question

是Jquery的新手。

我想在同一个按钮上插入和编辑值。以下代码正在使用。它正常工作并在插入和删除时使用通用代码。

function save(){

if($('#job').val()==" "){
    if(value!=false){
    var data = {        
        "names": $('#names').val(),            
        "server": $('#server').val()
    };
    $.ajax({
        type: 'post',
        url: "/insert",
               });
  }
}
else{

    if(value!=false){
    var data = {

    };
    $.ajax({
        type: 'post',
        url: "/edis",
                   }
    });
  }
}
}

是否有任何可能的方法来删除代码重复以及如何压缩此代码

Answer 1

<强>已更新

function saveToDB(){
var value= pageValidation();
var job;
var msg;

if(value!=false){

var data = {
        "jobid": $('#jobid').val(),
        "names": $('#names').val(),
        "os": $('#OS').val(),
        "browser": $('#browsers').val(),
        "version": $('#version').val(),
        "scripttype": $('#testscripts').val(),
        "server": $('#server').val()
    };

if($('#jobid').val().trim() == ""){
    job = "/insertJobs";
    msg = "job insertion success";
    delete data['jobid'];
}
else{
    job = "/editJobs";
    msg = "job Updated succesfully!!";
}



    $.ajax({
        type: 'post',
        url: job,
        dataType: "json",
        data: data,
        success: function (response) {
            console.log(msg);
            console.log(response);
            displayjobs();
        }
    });
  }
}

Answer 2

function saveToDB() {
    var value= pageValidation();
    var type = "update";
    if ($('#jobid').val()==" ") {   //set the flag
        type = "insert"
    }
    if(value!=false) {
        var data = {        
            "type": type, //See this, insert/update, check this on server side
            "names": $('#names').val(),
            "os": $('#OS').val(),
            "browser": $('#browsers').val(),
            "version": $('#version').val(),
            "scripttype": $('#testscripts').val(),
            "server": $('#server').val()
        };
        if (type == "update") {
            data.jobid = $('#jobid').val();
        }
        $.ajax({
            type: 'post',
            url: "/insertJobs",
            dataType: "json",
            data: data,
            success: function (response) {
                if (type == "insert") {
                    console.log("job insertion success");
                } else {
                    console.log("job Updated succesfully!!");
                }
                console.log(response);
                displayjobs();
            }
        });
    }
}

Answer 3

在您的主要条件下，您复制几乎相同的代码。您可以将此代码转换为函数并覆盖与函数参数的小差异。在主要条件下调用此函数应该可以解决这个问题。

这是我的自定义（我没有尝试代码）：

function saveToDB(){
  var value = pageValidation();

  if($('#jobid').val()==" ") manageData('/InsertJobs'); else manageData('/editJobs', true);

}

function manageData(url, value = false){
  var data = {
      "jobid": $('#jobid').val(),        
      "names": $('#names').val(),
      "os": $('#OS').val(),
      "browser": $('#browsers').val(),
      "version": $('#version').val(),
      "scripttype": $('#testscripts').val(),
      "server": $('#server').val()
  };
  $.ajax({
      type: 'post',
      url: url,
      dataType: "json",
      data: data,
      success: function (response) {
          if($value == false) console.log("job insertion success"); else console.log("job Updated succesfully!!");
          console.log(response);          
          displayjobs();
      }
  });
}

Answer 4

1）在saveToDB方法中扩展变量范围。

var data = {        
        "names": $('#names').val(),
        "os": $('#OS').val(),
        "browser": $('#browsers').val(),
        "version": $('#version').val(),
        "scripttype": $('#testscripts').val(),
        "server": $('#server').val()
    };
var urlLink;
var message;

2）从您的代码看来， value 变量正在扮演重要角色，并将其作为第一个条件。

3）虽然assingning数据对象没有job所以在这种情况下你可以添加它。

if($('#jobid').val()==" "){
 urlLink = "/insertJobs";
 message = "job insertion success";
}
else {
 data.job = $('#jobid').val();  // Add job to data object
 urlLink = "/editJobs";
 message = "job Updated succesfully!!";
}

最后你的代码就像

function saveToDB(){
    var value= pageValidation();
    if(value!=false){
        var data = {        
                "names": $('#names').val(),
                "os": $('#OS').val(),
                "browser": $('#browsers').val(),
                "version": $('#version').val(),
                "scripttype": $('#testscripts').val(),
                "server": $('#server').val()
            };  
        if($('#jobid').val()==" "){
         urlLink = "/insertJobs";
         message = "job insertion success";
        }
        else {
         data.job = $('#jobid').val();
         urlLink = "/editJobs";
         message = "job Updated succesfully!!";
        }           
        $.ajax({
            type: 'post',
            url: urlLink,
            dataType: "json",
            data: data,
            success: function (response) {
                console.log(message);
                console.log(response);
                displayjobs();
            }
        });
      }
}

Jquery删除重复的代码

4 个答案: