如何在javascript中的值内连接变量

Question

I want to concatenate the variable 'Surname' inside the value = '' but I can't seem to get the syntax to do that. So that I can display the values of the particular variable into an input field

function add() {

   var Surname = document.getElementById('b_surname').value;
   var Maiden = document.getElementById('b_maidenn').value;
   var Relationship = document.getElementById('b_relationship').value;
   var Othername = document.getElementById('b_othern').value;
   var City = document.getElementById('b_city').value;
   var Suburb = document.getElementById('b_suburb').value;
   var Address = document.getElementById('b_gps').value;
   var DoB = document.getElementById('b_dob').value;
   var Landmark = document.getElementById('b_landmark').value;
   var Email = document.getElementById('b_email').value;
   var Percentage = document.getElementById('b_percentage').value;



    var new_chq_no = parseInt($('#total_chq').val()) + 1;
    // var new_chq_no1 = parseInt($('#total_chq1').val()) + 1;
   
    var new_input =
        "<input class='form-control ' name='list_servicename[]' value =''style='margin-bottom:10px'id='new_" +
        new_chq_no +
        "'> " + Surname + ">";
    var new_input1 =
        "<input type='text' class='form-control' name='list_serviceprice[]' style='margin-bottom:10px'  id='new_" +
        new_chq_no + Maiden + "'>";
        var new_input2 =
        "<input type='text' class='form-control' name='list_service[]' style='margin-bottom:10px'  id='new_" +
        new_chq_no + Othername + "'>";
        var new_input3 =
        "<input type='text' class='form-control' name='list_[]' style='margin-bottom:10px'  id='new_" +
        new_chq_no + Relationship + "'>";
        var new_input4 =
        "<input type='text' class='form-control' name='list_[]' style='margin-bottom:10px'  id='new_" +
        new_chq_no + Percentage +"'>";

    $('#new_chq').append(new_input);
    $('#new_chq1').append(new_input1);
    $('#new_chq2').append(new_input2);
    $('#new_chq3').append(new_input3);
    $('#new_chq4').append(new_input4);
    $('#total_chq').val(new_chq_no);
    $('#total_chq1').val(new_chq_no1);
}

Answer 1

Try

var new_input = `<input class='form-control ' name='list_servicename[]' value = ${Surname} style='margin-bottom:10px'id='new_`

You can put variables values as string values if using `` and ${yourvariable} syntax