0

Есть много дополнительных вопросов по конкатенации в Интернете, но я не уверен, почему я получаю такое поведение. Я не пытаюсь «добавить» очевидные строки, и я пробовал parseInt и parseFloat по всем значениям безрезультатно. Мне нужно получить значение из атрибута data-page, который будет содержать представление числового значения (я понимаю, вероятно, как неявная строка). Я замечаю, что пока получаю значение из атрибута data-page, я не могу выполнять добавление переменных. Если я заменил его жестко закодированным 1, все будет хорошо. Значения всегда должны быть целыми числами, но я попробовал parseFloat, чтобы узнать, получилось ли у меня такое же поведение. Что я и сделал.Необычное добавление JavaScript в сочетании с конкатенацией

Некоторые примеры кода приведены ниже. Предположите, $("#pagination").attr('data-page').trim() оценивает на 1.

//Tried parseFloat 
//datapage = 1 //This works as expected 
dataPage = parseFloat($("#pagination").attr('data-page').trim()); //This does not work as expected 
curPage = (parseFloat(dataPage) + parseFloat(1)); 
console.log(curPage); //Outputs '11' instead of '2' 

//Tried parseInt 
//datapage = 1 //This works as expected 
dataPage = parseInt($("#pagination").attr('data-page').trim()); 
curPage = (parseInt(dataPage) + parseInt(1)); 
console.log(curPage); //Outputs '11' instead of '2' 
+1

Не могли бы вы также разместить HTML-код? Оба ваших примера работают отлично для меня. –

+0

Я думаю, что код ** без ** 'parseFloat' и' parseInt' не работает. Это должно работать, во всяком случае, почему вы называете 'parseFloat' и' parseInt' 2 раза? –

+0

@MarioAlexandroSantini Я вызываю parseFloat/parseInt дважды для избыточности, чтобы гарантировать, что я получаю то, что, я думаю, получаю. Обычно я не делал этого в производственном коде. –

ответ

2

Все работает должным образом. Смотрите эту codepen: http://codepen.io/anon/pen/zBwOPW

HTML:

<body> 
    <input id="pagination" data-page="1" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script> 
</body> 

Оригиналы JS без изменений .:

//Tried parseFloat 
//datapage = 1 //This works as expected 
dataPage = parseFloat($("#pagination").attr('data-page').trim()); //This does not work as expected 
curPage = (parseFloat(dataPage) + parseFloat(1)); 
console.log(curPage); //Outputs '11' instead of '2' 

//Tried parseInt 
//datapage = 1 //This works as expected 
dataPage = parseInt($("#pagination").attr('data-page').trim()); 
curPage = (parseInt(dataPage) + parseInt(1)); 
console.log(curPage); //Outputs '11' instead of '2' 
+0

Возможно, вы захотите пересмотреть это, чтобы использовать «встроенный» веб-фрагмент. – JonSG

0

После некоторых замечаний и заверению, JavaScript был правильно я начал смотреть на другие различия между моим существующий код и опубликованные фрагменты примера. Оказывается, проблема связана с Smarty - механизмом шаблона, который я использую. Атрибут data-page заполнен переменной Smarty, и когда я переключил это с помощью жестко закодированного значения, добавление работало, как ожидалось.

Что не работает:

<div id="pagination" class="col-xs-12 col-md-5 paginationBar" data-page="{$paginationPage}" data-pageMax="{$paginationPageMax}" data-pageQty="{$paginationQty}">...<div> 

Что работает:

<div id="pagination" class="col-xs-12 col-md-5 paginationBar" data-page="1" data-pageMax="1000" data-pageQty="10">...<div> 

Я не знаю, почему это ставит вопрос только пока. Но это определенно то, что вызывает его. Если я выясню, почему и/или как исправить это, я обязательно обновлю этот ответ.

+0

Что произойдет, если вы попробуете что-то сумасшедшее, как '10000- (9999- (dataPage))'? Математически это должно получиться точно так же, как 'dataPage + 1', но оно не использует никаких плюсовых знаков. –