JS/jQuery - 요소 ID의 숫자를 함수의 변수로 사용하려면 어떻게해야합니까?

Question

기본적으로 하나의 기능이 클릭 ​​한 항목에 따라 여러 요소에 개별적으로 작용하기를 원합니다.

내가 같은 일을 이러한 기능의 3이 :

$("#morelink1, #pic1").click(function() { 
var imgHeight = $(".pic").height(); 
var image = $('#more1').parent('.content').siblings(
    '.image'); 
if ($('#more1').is(":visible")) { 
    $("#more1").slideUp(200, "linear"); 
    image.height(contHeight); 
    showtext1(); 
    $("#closemore1").hide(); 
} else { 
    $("#more1").slideDown(200, "linear"); 
    image.height(imgHeight); 
    hidebutton1(); 
    hidetext1(); 
} 
}); 

당신이 볼 수 있듯이, 나는 "1"이 기능에서 모든 최종 작업을하고있는 ID의 이름 이 함수를 2와 3으로 복사했습니다.

복제하는 대신 #morelink1에서 숫자를 추출하여 변수로 만들고 함수의 ID에 숫자를 추가해야합니다.

내가 좋아하는 뭔가를하고 싶습니다 :

var NUMBER = [get the number from the ID of the element that was clicked]; 

$("#morelink + NUMBER, #pic + NUMBER").click(function() { 

나는 또한이 기능에 내장 된 기능을 가지고 - showtext1(), hidebutton1() 및 hidetext1(). 그것들은 변경된 번호로 복제됩니다. 이 함수 내에서 동일한 작업을 수행 할 수 있기를 원합니다. 그것은 showtext(NUMBER)과 같은 것이겠습니까?

나는 주변을 둘러 보았고이를 수행 할 방법을 찾지 못했습니다.

숫자를 함수에 전달하는 등의 다른 방법이 있습니까?

Answer 1

대신에, 단지 대신 완전히 id을 지정하는 the "starts with" operator를 사용하도록 선택을 수정

관계없이 id 값이 'morelink' 또는 'pic'로 시작하는 모든 요소를 ​​일치합니다

$("[id^='morelink'], [id^='pic']").click(function() { 

무엇 id의 나머지 입니다.

클릭 핸들러에서 여전히 값이 필요하면 현재 요소의 id에서 파싱 할 수 있습니다.

var idString = $(this).attr('id'); 
// use whatever logic you define to parse the number value. 
// for example, maybe a regular expression which matches only numeric characters? 

Answer 2

전체 코드를 공유 할 수 있다면 도움이됩니다.

// Append click event to elements whose id starts with morelink or pic. 
$('[id^="morelink"], id^=["pic"]').click(function() { 
    // Get id of current clicked element. 
    var id = $(this).attr('id'); 
    // Use RegExp to extract number. 
    var number = id.match(/[\d]+/)[0]; 

    // Your functions starting. 
    var imgHeight = $(".pic").height(); //should this be pic + NUMBER? 
    var image = $('#more' + number).parent('.content').siblings('.image'); 

    if ($('#more' + number).is(":visible")) { 
    $('#more' + number).slideUp(200, "linear"); 
    image.height(contHeight); 
    // Executes selectMore1(); if number = 1 
    window['showtext' + number](); 
    $("#closemore" + number).hide(); 
    } else { 
    $("#more" + number).slideDown(200, "linear"); 
    image.height(imgHeight); 
    // Executes hidebutton1(); if number = 1 
    window['hidebutton' + number](); 
    // Executes hidetext1(); if number = 1 
    window['hidetext' + number](); 
    } 
}); 

그러나, 나는 (hidebutton1 생각하지 않습니다) 존재해야하지만, hidebutton (수) : 나의 이해에서, 이러한 라인을 따라 뭔가해야합니다. 그래서 전체 코드가 실제로 여러 함수를 작성하여 의미하는 것을 이해하도록 요청한 것입니다.

Answer 3

변수 이름의 접두사를 알고있는 경우 원하는 번호를 접미사로 사용하십시오. 그런 다음 jQuery 선택기에 연결하십시오. 전에 직접 입력했으면 $(YourNewVariableForID)과 같은 직접 플러그가 작동하지 않으면 을 시도해보십시오.