javascript - divの色と番号のonclickを変更する

Question

div のクリックで html 要素の色と数を変更したいと思います。たとえば、クリックup-arrowすると数字が 4 から 5 に変わり、色も変わります。

initial state

↑ 4 ↓

upvoted

↑ 5 ↓

down voted

↑ 3 ↓

これが私がこれまでに持っているものです。
クリックで div の色を変更する方法は知っていますが、別の div の onclick から div の色を変更する方法がわかりません。その上に +1 または -1 を追加します。

http://jsfiddle.net/64QpR/23/

note- user: uneducatedguyがこの同じ質問をしましたが、jsfiddle ではなく fiddle と呼んだため、人々が彼をからかったため、削除しました。

Answer 1

Knockoutを使用すると、これは非常に簡単です。

HTML:

<div class="arrow-up" data-bind="click: num.upvote.bind(num)"></div>
<h5 data-bind="text: num.value, css: { pink: num.changed }">3</h5>
<div class="arrow-down" data-bind="click: num.downvote.bind(num)"></div>

JavaScript:

function Num(value) {
    this.value = ko.observable(value);
    this.changed = ko.observable(false);
}

Num.prototype.upvote = function() {
    this.value(this.value()+1);
    this.changed(true);
}

Num.prototype.downvote = function() {
    this.value(this.value()-1);
    this.changed(true);
}

var model = {
        num: new Num(1),
}

ko.applyBindings(model);

実際に見てみましょう:

http://jsfiddle.net/bikeshedder/UvKsz/

複数投票に対する保護あり:

http://jsfiddle.net/bikeshedder/UvKsz/1/

Answer 2

このようなことを意味しますか？

$('#clickDIV').click(function() {
  var x = $('#zielDIV').text() +1;
  $('#zielDIV').html(x);
});