JQuery와 선택

플러그인 데모에 선택-결과 쇼 메시지 사용자가 다음 "버튼"중 하나를 선택한 다음 데모에서와 같이 선택된 번호 대신 표시 할 메시지를 표시 할 수있게하려는 것입니다 (데모에서와 같이)JQuery와 선택

그래서 : 선택하셨습니다 : # 2. 은 다음과 같습니다 당신이 선택한 : 영국, 고토주십시오과 그런이 ... 가장 쉬운 방법을 추측

메신저 자바 스크립트입니다 등

if "select-result" = 1 then 
else

정렬합니까?

도움이 될 것입니다.

<html> 
<head> 
<title>jQuery UI Selectable - Serialize</title> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery- ui.css" /> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> 
<link rel="stylesheet" href="/resources/demos/style.css" /> 
<style> 
#feedback { font-size: 1.4em; } 
#selectable .ui-selecting { background: #FECA40; } 
#selectable .ui-selected { background: #F39814; color: white; } 
#selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; } 
#selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; } 
</style> 
<script> 
$(function() { 
$("#selectable").selectable({ 
    stop: function() { 
    var result = $("#select-result").empty(); 
    $(".ui-selected", this).each(function() { 
     var index = $("#selectable li").index(this); 
     result.append(" #" + (index + 1)); 
    }); 
    } 
}); 
}); 
</script> 
</head> 
<body> 
<p id="feedback"> 
<span>You've selected:</span> <span id="select-result">none</span>. 
</p> 

<ol id="selectable"> 
<li class="ui-widget-content">UK</li> 
<li class="ui-widget-content">USA</li> 
<li class="ui-widget-content">FR</li> 
<li class="ui-widget-content">AU</li> 
<li class="ui-widget-content">CA</li> 
<li class="ui-widget-content">DE</li> 
</ol> 
</body> 
</html>

출처

2013-03-25 Benjamin

var index = $("#selectable li").index(this);

이 우리가 통과 한 요소의 인덱스를 잡고 : 나는

코드 ...이 바보 같은 질문하지 않습니다 바랍니다. 우리는이 선을 필요로하지 않습니다.

result.append(" #" + (index + 1));

색인은 DOM을 내리는 동안 요소가 발생하는 위치입니다.

위의 행을 하나의 간단한 것으로 변경할 수 있습니다.

$(".ui-selected", this).text().appendTo(result);

편집는 : this 전체 UL 참조 할 수 있습니다, 위의 내용을 참조하십시오, 그래서 우리는 선택 항목하여 필터링 할 필요가있다. 다중 선택을 허용하는 경우 아래를 참조하십시오.

$(".ui-selected", this).each(function(){ 
    $(this).text().appendTo(result); 
});

출처

2013-03-25 05:49:40 Ohgodwhy

이 모든 것을 선택 생각하는 것 같다하려고? 글 머리 기호로 목록을 표시 하시겠습니까? 내가 뭐 잘못하고있는거야? – Benjamin

@ user1871802 지금 시작하십시오. 아마 작은 감시. – Ohgodwhy

안녕하세요. 도움을 청합니다. :) 그 결과는 저에게 있어야합니다. http://i.imgur.com/TGq36sL.png 그냥 점이 있습니까? – Benjamin

플러그인의 예 .. 당신이 .. 당신이해야 할 것은 선택의 텍스트를 얻을 기간에 보여입니다 ... 그렇게 할 필요가 있으므로 사용하지 마십시오 선택된 인덱스를 보여주고있다 .. html() 또는 text() ..

는이

$(function() { 
    $("#selectable").selectable({ 
    stop: function() { 
     var result = $("#select-result"); 
     result.html($(this).html()); // result.text($(this).text()); 
    } 
    }); 
});

출처

2013-03-25 06:01:29 bipen

그것이 전부라고 생각하는 것 같습니다. http://i.imgur.com/tBs6HxT.png – Benjamin

JQuery와 선택

답변

관련 문제