2012-10-06 3 views
0

을 클릭에서 자동 견인 입력 필드를 채울 나는 <div class="foo">Foo</div>하고 난 두 개의 입력 필드가 있습니다- 하나 개의 사업부

  1. <input type="submit" class="text_field" name="input_one" value="">
  2. <input type="submit" class="text_field" name="input_two" value="">
내가 수 있도록하고 싶습니다

<div>Foo</div>을 클릭하고 필드 # 1에 값 Foo을 채우고 필드 2에 값을 Bar으로 채 웁니다. (이 아이디어를 바탕으로 여러 div를 통합함으로써 다양한 가치 조합을 구현할 수 있습니다.) jQuery를 사용하여 가장 좋은 방법은 무엇입니까?

jQuery(function() { 
$('div.foo').click(function (e) { 

    var foo = $(this).text(); 

    $("input.text_field").val(foo); 
}); 
});​ 

이, 즉, "푸"사업부를 클릭하고 태그 사이의 텍스트 값 하나의 텍스트 필드를 채우는 일 :

은 지금까지 나는 아무 문제 일 같은이 없습니다. 이것은 좋은 시작과 모든 것입니다. 그러나이 책을 처음 접한 이래로 저는 두 가지 다른 값 "Foo"와 "Bar"로 두 개의 다른 텍스트 필드를 채우는 것이 가장 좋은 방법인지 궁금합니다. div에 대해 name="Bar" 또는 그 효과를 설정 한 다음 두 번째 텍스트 필드 input_two에 삽입 할 해당 이름 값에 액세스 할 수 있습니까? 생각, 의견, 고맙습니다. 감사합니다.

답변

1

당신이 당신이해야 할 일을 설명 할 수, 이상한 질문 http://api.jquery.com/id-selector/? 내 말은, 네가하고 싶은 걸 올렸지 만 왜 그걸하고 싶니? Bar와 Foo가 무엇인지 명확하지 않습니다. 각 제출에 대해 미리 정의 된 값입니까? 값이 div에 의존하는지 (두 개 이상의 div가 있고 어떤 div가 클릭되었는지에 따라 입력을 채워야한다고 가정 해 보겠습니다)

원하는 태그에 속성을 넣고 $를 사용하여 액세스 할 수 있습니다 . 당신이 뭔가 같은

<div class='clickeable' data-input1='foo' data-input2='bar'></div> 
<div class='clickeable' data-input1='baz' data-input2='xxx'></div> 

을 가질 수있다 ([선택])은 ATTR ('ATTR_NAME') 값을 얻을 수는 HTML5는 일부 "데이터 -는"그 http://html5doctor.com/html5-custom-data-attributes/

편집과 같은 일을 저장하는 속성 정의 및 js

다음 JS

은 일반적이며 모든 값 오순절 원하는만큼 된 div를 추가 할 수 있습니다

+0

당신이 언급 네, 그리고 예, 값이 사업부에 의존 않습니다 제출할 각각에 대해 미리 정의 된 값은 정확히이다 그것에. 그래서 당신이 말했듯이'$ ([selector]). attr ('attr_name')'을 사용하는 것이 아마도 이것을 관리하는 가장 쉽고 쉬운 방법 일까? 그리고 나는 사용자의 편의를 위해이 두 입력 필드 (일부 사전 정의 된, 자주 사용되는 값)를 채우기를 원한다고 덧붙이고 싶습니다. 따라서 사용자는 입력 할 필요가 없습니다. 말할 필요도없이 사용자가 그렇게하려면 div를 클릭합니다. –

+0

내 편집을 참조하십시오 – arieljuod

+0

고마워요. 나는 그것을 약간 조정했고'$ ([selector]). attr ('attr_name')' –

0

사용 아이디 선택 :

<div class="foo"> 

    <input type="submit" id="one" class="text_field" name="input_one" value=""> 
    <input type="submit" id="two" class="text_field" name="input_two" value=""> 
</div> 


jQuery(function() { 
$('div.foo').click(function (e) {  
    var foo = $(this).text();  
    $("#one").val(foo); 
    $("#two").val("Bar"); 
}); 
});​