2016-11-21 262 views
0

我是JavaScript和jQuery的新手,我正在開發一款應用程序,目前遇到了麻煩。我有一個對象的屬性,我想在click事件上動態更改,特別是切換。jQuery:動態更改對象的屬性

示例代碼:

var apples = { 
value: "$1.00", 
propertyIwantToChange: red 
}; 

上單擊事件觸發,物業會變成綠色,然後再次單擊它會是紅色的。

propertyIwantToChange: greenpropertyIwantToChange: redpropertyIwantToChange: green等等。

我想知道是否有人對此有所瞭解?任何幫助表示讚賞。

+1

從案例的解決方案,只要你提到'apples.propertyIwantToChange = apples.propertyIwantToChange =='green'? '紅':'綠'! –

回答

1

更多使用三元風格的通用功能:

var apples = { 
 
    value: "$1.00", 
 
    propertyIwantToChange: 'green' 
 
}; 
 

 
var toggle = function(obj, prop, first, second) { 
 
    obj[prop] = obj[prop] == first ? second : first; 
 
}; 
 

 
$('input').on('click', function() { 
 
    toggle(apples, 'propertyIwantToChange', 'green', 'red'); 
 
    console.log(apples.propertyIwantToChange); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="button" value="Toggle value" />

1

希望這個片段將

var apples = { 
    value: "$1.00", 
    propertyIwantToChange: 'red' 
    }; 
    function onClickHndler() { 
    // check the property value & change it 
    //using ternary operator 
    apples['propertyIwantToChange'] == 'red' ? 
    apples['propertyIwantToChange'] = 'green' : 
    apples['propertyIwantToChange'] = 'red' 
} 
+0

對於錯字感到抱歉。感謝編輯它 – brk

2

您可以創建對象的getter setter方法有用,那麼你就可以相應地檢查值,並將其更改

var apples = { 
value: "$1.00", 
propertyIwantToChange: 'red', 
getpropertyIwantToChange : function(){return this.propertyIwantToChange}, 
setpropertyIwantToChange : function(val){this.propertyIwantToChange = val} 
} 

隨後的onclick檢查值並根據需要設定值

if(apples.getpropertyIwantToChange() == 'red'){ 
    apples.setpropertyIwantToChange('green') 
    }else{ 
    apples.setpropertyIwantToChange('red') 
} 
0

你的意思是使用三元運算符這裏@Dhaval Marthak說,

apples.propertyIwantToChange = apples.propertyIwantToChange == 'green' ? 'red' : 'green'

您可以在Conditional (ternary) Operator