Jquery отображает значение флажка в div

У меня есть этот скрипт, который позволяет мне отображать значение (текст), которое находится рядом с флажком (aspx). При изменении флажка текст отображается в div через запятую. Каким-то образом, если какой-либо из флажков установлен, а затем повторно отмечен, значение не исчезает из JobIDs var. Что мне здесь не хватает?

 $(document).data('JobNumbers', "");
 $('[id*=projectchk] input').change(function() {
    var JobIDs = "";
    var JobIDs = $(':checked').map(function() {
        return $(this).closest("span").find("label").html();
    }).get().join(', ');
    var JobNumbers = "<label> Reference Job #:</label> " + JobIDs;
    $('#job_numbers').html(JobNumbers);
    if (JobIDs != "") {
        $(document).data('JobNumbers', JobNumbers);
    }
    return false;
 });

Итак, если установлены 3 флажка, отображается:

введите здесь описание изображения

Но даже если я выберу их все, он все равно покажет последний:

введите здесь описание изображения

Спасибо.


checkbox html jquery asp.net
person Fresher    schedule 27.09.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Когда вы отменяете выбор всех из них, этот оператор становится false:

if (JobIDs != "") {
    $(document).data('JobNumbers', JobNumbers);
}

И поэтому ваш код не выполняется.

РЕДАКТИРОВАТЬ: Если вы не хотите отображать метку в случае, если параметр не выбран, я думаю, что это сработает:

 $(document).data('JobNumbers', "");
 $('[id*=projectchk] input').change(function() {
    var JobIDs = "";
    JobIDs = $(':checked').map(function() {
        return $(this).closest("span").find("label").html();
    }).get().join(', ');
    var JobNumbers = "";
    if (JobIDs != "") {
        JobNumbers = "<label> Reference Job #:</label> " + JobIDs;
    }
    $('#job_numbers').html(JobNumbers);
    $(document).data('JobNumbers', JobNumbers);
    return false;
 });

Вот также хороший практический совет: вам не нужно писать var каждый раз, когда вы используете переменную, только когда вы ее объявляете. Я также настоятельно рекомендую вам почитать о JavaScript let и const =)

person Canta    schedule 27.09.2017
comment
Итак, мой вопрос отсюда будет таким: если все флажки не выбраны, как я могу снова сделать div #job_numbers пустым? Он пуст в начале, прежде чем функция будет выполнена. - person Fresher; 27.09.2017
comment
если вы выполните этот код без оператора if, разве это не сработает? - person Canta; 28.09.2017
comment
Да, проблема с остатком стоимости решена. Но ‹ярлык› все равно остался. - person Fresher; 28.09.2017
comment
Только что отредактировал мой ответ. Пожалуйста, проверьте это и напишите мне @Fresher - person Canta; 29.09.2017
comment
работает. спасибо Артур. Иногда это проще, чем вы думаете! - person Fresher; 29.09.2017