2010-06-07 15 views
0

Cela peut sembler une demande étrange, mais j'aimerais utiliser l'outil Sélectionnable de jQuery pour ne sélectionner qu'un élément à la fois et je voudrais qu'il me montre une valeur que j'aurai dans chaque balise. À tout le moins, je veux le contenu de cette sélection. Quelqu'un at-il essayé de le faire? Pour une raison quelconque, ces petites choses ne semblent pas facilement trouver dans leur API pour cela.jQuery Selectable sélectionne seulement 1 et obtient une valeur?

+0

Votre question ne concerne pas semble clair pour moi, pouvez-vous être précis avec un exemple. Cependant, vous pouvez toujours restreindre votre sélection en utilisant le critère de sélection jQuery: eq (n). –

+0

Non Non, je ne parle pas du sélecteur que je veux dire en utilisant selectable - http://jqueryui.com/demos/selectable/#option-filter. Je voudrais l'utiliser, mais, pour une raison quelconque, je ne peux pas comprendre comment forcer une seule sélection à la fois ET obtenir les valeurs dans l'étiquette sélectionnée – jphenow

Répondre

0

Si vous voulez seulement une sélection à la fois, alors pourquoi utiliser selectable?

Je pense que vous utiliseriez simplement jQuery, car il devrait être très facile. Ou est-ce que votre point me manque?

en direct Exemple:http://jsfiddle.net/F7fsx/

HTML

<div id='container'> 
    <div id='one'>one</div> 
    <div id='two'>two</div> 
    <div id='three'>three</div> 
</div> 
​ 

CSS

#container div { 
    width: 50px; 
    height: 50px; 
    border: 2px dashed red; 
    margin: 10px; 
    color: white; 
    background:orange; 
} 
​ 

jQuery

$('#container div').click(function() { 
    $th = $(this); 
    $th.css('backgroundColor','yellow'); 
    var value = $th.text() 
    alert(value); 
});​ 
+0

Ha Yea Je n'ai aucune idée de pourquoi je n'ai pas fait ça très rapidement. Je vais donner le vôtre ou la réponse ci-dessous à la fois un coup et voir ce que j'aime mieux. Merci! Attendez-vous que $ th.text fonctionne si j'insère la section sélectionnée du code aspbe derrière? Je pense que c'est pourquoi quand j'essaie d'obtenir la valeur maintenant, ça ressemble à une merde brouillée – jphenow

+0

@jphenow - '$ th.text()' obtient simplement le contenu textuel de l'élément sur lequel on a cliqué. Il suppose que vous cliquez sur un élément existant avec du contenu existant. Ça ne devrait pas avoir d'importance d'où ça vient. Juste un exemple générique, car je ne connais pas votre situation spécifique. Essayez l'exemple en direct que j'ai posté. – user113716

+0

@jphenow - Si vous voulez dire que les éléments sont ajoutés dynamiquement, vous devrez utiliser 'live (...)' au lieu de 'click (...)', comme dans $ ('# container div'). live ('click', function() {... ' – user113716

0

Un poste de la jQuery Forum offre le code suivant pour limiter la sélection à un seul article:

$("li").live("click", function(event) { 
    $(this).siblings().removeClass("selected"); 
    $(this).addClass("selected"); 
}); 

En ce qui l'extraction de données, est le code ici que l'équipe jQuery UI utilise dans le Serialize Demo, pour extraire les données de chaque élément sélectionné:

$("#selectable").selectable({ 
     stop: function(){ 
      var result = $("#select-result").empty(); 
      $(".ui-selected", this).each(function(){ 
       var index = $("#selectable li").index(this); 
       result.append(" #" + (index + 1)); 
      }); 
     } 
    }); 

Et le balisage HTML est:

<ol id="selectable"> 
<li class="ui-widget-content">Item 1</li> 
<li class="ui-widget-content">Item 2</li> 
<li class="ui-widget-content">Item 3</li> 
<li class="ui-widget-content">Item 4</li> 
<li class="ui-widget-content">Item 5</li> 
<li class="ui-widget-content">Item 6</li> 
</ol> 
+0

C'est génial merci, je vais donner un coup de feu – jphenow