需要javascript的快速帮助 [英] Need quick help with javascript

问题描述

好吧，这就是我的样子：



http ：//puu.sh/jBcjs/f379e46bf0.png [ ^ ]



我有一个脚本所以当我选中复选框时我的基准：frield将自动更新如果我检查超过1个日期它将会是这样的：



YYMMDD YYMMDD YYMMDD



但问题是，我不能选择任何日期。

如果我想选择任何日期，我需要先选择第一个日期，然后再选择其他日期。



所以这不起作用：

http://puu.sh/jBcoI/286fd5b4b4.png [ ^ ]



但如果我选择它的第一个日期，可以在这里看到：

http ：//puu.sh/jBcq8/d5b1bac434.png [ ^ ]



这是我的剧本。

Alright so, this is how my looks like:

http://puu.sh/jBcjs/f379e46bf0.png[^]

I have a script so when I check the checkbox my Datum: frield will automatically get updated if I check more than 1 date it will looks like this:

YYMMDD YYMMDD YYMMDD

But the problem is, I can't choose any date.
If I want to choose any date at all I'll need to select the first date first, and than the other dates.

So this doesn't work:
http://puu.sh/jBcoI/286fd5b4b4.png[^]

But if I select the first date it works as can be seen here:
http://puu.sh/jBcq8/d5b1bac434.png[^]

this is my script.

function SetDate(dt) {
       if(document.getElementById("isoDate").checked) {
           if(dateArr.indexOf(dt)<0){ //Check if date is already added. if not add it to array.
              dateArr.push(dt);
        }
        else{
             var index=dateArr.indexOf(dt);
             if (index > -1) {
                dateArr.splice(index, 1);//Remove from array if checkbox uncheck
        }
      }
         $('#date').val(dateArr.join(" ")); //Add space separated string to the #date element.
     }
    }

这是我的观点，我得到的日期

< br $>

And this is my view where I get the dates

@foreach (var date in ViewBag.MissingDays)
                                            {
                                                var isoDate = date.ToString("yyMMdd");
                                                <div class="col-md-1">
                                                    <input type="checkbox" id="isoDate" name="isoDate" value="@isoDate"onclick="javascript:SetDate('@isoDate');" />
                                                    @isoDate
                                                </div>
                                            }

推荐答案

（' #date'）。val（dateArr.join（ ））; // 将空格分隔的字符串添加到#date元素。
}
}

('#date').val(dateArr.join(" ")); //Add space separated string to the #date element. } }

这是我的观点，我得到的日期

< br $>

And this is my view where I get the dates

@foreach (var date in ViewBag.MissingDays)
                                            {
                                                var isoDate = date.ToString("yyMMdd");
                                                <div class="col-md-1">
                                                    <input type="checkbox" id="isoDate" name="isoDate" value="@isoDate"onclick="javascript:SetDate('@isoDate');" />
                                                    @isoDate
                                                </div>
                                            }

问题是你有多个id =isoDate的元素，如果你想处理它是不可能的。改用class;）。这样你总是只检查第一个元素！这就是检查第一个盒子时它起作用的原因。


我在这里创建了简单的笔：

http://codepen.io/xszaboj/pen/RPOEGP?editors=101 [ ^ ]



当然你必须根据自己的需要进行编辑，但它应该提供关于点击事件背后的简单想法以及如何正确使用它。



不要使用：onclick = JavaScript的：的setDate（ '@ isoDate'）; !!!



它会为您案例中的每个复选框创建一个事件。尝试捕捉它而不是父元素。在我的演示#parent。

然后在点击事件中使用

Hi, problem is that you have multiple elements with id="isoDate", that is not possible if you want to process it. Use class instead ;). This way you always only check first element! and that is reason why it work when first box is checked.

I've created simple pen here:
http://codepen.io/xszaboj/pen/RPOEGP?editors=101[^]

Of course you have to edit it to your needs, but it should provide the simple idea behind on click event and how to use it properly.

Do not use this: onclick="javascript:SetDate('@isoDate');" !!!

It will create event for every on of your checkbox in your case a lot. Try to catch it rather on parent element. in my demo #parent.
then in click event by using

（这个）你将获得你点击的元素，这样你将获得元素的价值（日期），您可以检查您的某个全局数组中是否已存在此日期。

(this) you will get element you clicked on, that way you will get value of element (date) and you can check if you have this date already in some global array.

这篇关于需要javascript的快速帮助的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！