क्लिक पर छवि और alt विशेषता कैसे बदलें?

मैं सामान्य जावास्क्रिप्ट की बजाय JQuery का उपयोग करके कई छवियों को क्लिक करना चाहता हूं और पहुंच के लिए एक ही समय में छवि alt विशेषता को बदल सकता हूं।क्लिक पर छवि और alt विशेषता कैसे बदलें?

यह कुछ आसान होना चाहिए क्योंकि मैं बदलाव पर कुछ विशेष प्रभाव नहीं दिख रहा हूं लेकिन मुझे अभी भी इसके बारे में कुछ भी नहीं मिला है।

यहाँ जिस तरह से (बिना वैकल्पिक विशेषता बदल) मैं जे एस के साथ कर रहा था है:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Change Image using Javascript</title> 
<script type="text/javascript"> 
    function changeImg(image_id, image_folder){ 
    document.getElementById(image_id).src = image_folder; 
} 
</script> 
</head> 
<body> 
<div align="center"> 

<img id="image1" src="images/nameofthesubfolder/originalimage1.jpg" alt="Original Image 1" /> 
<br /> 
    <label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image1.jpg')"/>Image 1</label> 
    <label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image2.gif');"/>Image 2</label> 
    <label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image3.png');"/>Image 3</label> 
    <label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image4.jpeg');"/>Image 4</label> 
<br /> 
<br /> 
<img id="image2" src="images/nameofthesubfolder/originalimage2.jpg" alt="Original Image 2" /> 
<br /> 
    <label><input type="radio" name="radio_btn2" onclick="changeImg('image2', 'images/nameofthesubfolder/image5.gif')"/>Image 5</label> 
    <label><input type="radio" name="radio_btn2" onclick="changeImg('image2', 'images/nameofthesubfolder/image6.png);"/>Image 6</label> 
    <label><input type="radio" name="radio_btn2" onclick="changeImg('image2', 'images/nameofthesubfolder/image7.jpeg');"/>Image 7</label> 
    <label><input type="radio" name="radio_btn2" onclick="changeImg('image2', 'images/nameofthesubfolder/image8.gif');"/>Image 8</label> 
</div> 
</body> 
</html>

और वहाँ एक तरह से दोहरा छवियों/nameofthesubfolder से बचने के लिए है /?

संपादित करें: धन्यवाद एक बहुत altCognito लेकिन मुझे समझ नहीं आता कि कैसे एक अलग alt है करने के लिए इस कोड का उपयोग करने के लिए प्रत्येक छवि के लिए विशेषता । शायद मैं यह उल्लेख करना भूल गया था कि मैं इसे ढूंढ रहा था (मेरा बुरा)।

स्रोत

2009-04-11 Mark

चलिए इसके साथ चलते हैं। (मैं इस के माध्यम से शुरू में पहुंचे)

<img id="radio_btn1" src="originalimage1.jpg" /> 
<br /> 
    <input type="radio" name="radio_btn1" value='image1.jpg' /> 
    <input type="radio" name="radio_btn1" value='image2.gif' /> 
    <input type="radio" name="radio_btn1" value='image3.png' /> 
    <input type="radio" name="radio_btn1" value='image4.jpeg' />

और फिर jQuery:

imgFldr = 'images/nameofthesubfolder/'; 
$("input[type='radio']").click(function() { 
    $('#'+this.name).attr('src', imgFldr+this.value).attr('alt', 'newattribute'); 
});

See the example। .. http://jsbin.com/esebu/edit

स्रोत

2009-04-11 00:53:59 cgp

आप वास्तव में न कि ज्यादा कोड परिवर्तन की जरूरत है

यहाँ एक उदाहरण है:

आप यहाँ इसे संपादित कर सकते

function changeImg(image_id, image_folder) { 
    $("#" + image_id).attr({ 'src': image_folder, 'alt': image_folder }); 
}

और तुम उर एचटीएमएल कोड रख सकते ..

<label><input type="radio" name="radio_btn2" onclick="changeImg('image2', 'images/nameofthesubfolder/image5.gif')"/>Image 5</label>

स्रोत

2011-08-25 13:22:50

मैंने अपने पृष्ठ पर यह भी कोशिश की कि यह पूरी तरह से ठीक काम करता है .. –

i आपको क्लिक भाग पर कोई समस्या है। जैसे कि यह कार्रवाई करने के लिए 2 बार लीट पर क्लिक करने पर इसे तुरंत उपयोग करें: 'onclick =" जावास्क्रिप्ट: changeImg ('image2', 'images/nameofthesubfolder/image5.gif') "' –

क्लिक पर छवि और alt विशेषता कैसे बदलें?

उत्तर

संबंधित मुद्दे