Замена символов в строке с помощью replace ()

Question

Я написал это js, чтобы извлечь значения из операторов выбора для создания ссылки, на которую пользователь будет отправлен. Проблема в том, что я использую это с Shopify, где продукты хранятся в

/products/handle 

, а Shopify использует '-' для замены '. в ссылках.

Я пробовал много разных способов использования функции замены, используя ее для одного экземпляра символа, сохраняя новое значение в переменной с другим именем и пытаясь выполнить замену при построении ссылки.

myForm.addEventListener('submit', function(e){
    e.preventDefault();
    var val1 = document.getElementById("shortSide").value;
    var val2 = document.getElementById("longSide").value;
    var val3 = document.getElementById("widthSide").value;
    var hyph = '-';
    if(val1 != "default" && val2 != "default" && val2 != "Long Side" && val3 != "default" && val3 != "Width")
      window.location.href = "/products/" + val1.replace(/\./g,hyph) + "x" + val2.replace(/\./g,hyph) + "x" + val3;
    else
        alert("Fill out everything please!");
}, false)

Если переменные содержат

var1 = '16.88'
var2 = '25.25'
var3 = '1'

Ожидаемый результат будет

/products/16-88x25-25x1

, но фактический результат равен

/products/16.88x25.25x1

Answer 1

. - это специальный символ в регулярном выражении (он будет соответствовать любому символу, кроме символов конца строки), вам нужно экранировать его с помощью обратного слэса sh:

val1.replace(/\./g,hyph) 

Например

var hyph = '-'
var val1 = '16.88'
var val2 = '25.25'
var val3 = '1'

console.log("/products/" + val1.replace(/\./g,hyph) + "x" + val2.replace(/\./g,hyph) + "x" + val3)

Answer 2

Вы можете попробовать это для решения вашей проблемы. . означает символ. Для ловли точки вы должны сделать что-то вроде \.;

var1 = '16.88'
var2 = '25.25'
var3 = '1';

let href = "/products/" + var1.replace(/\./g, '-') + 'x' + var2.replace(/\./g, '-') + 'x' + var3.replace(/\./g, '-');


console.log(href);