Multi values in select options

JavaScript
1

Multi values in select options.

Hi all

I have a simple select drop down menu here with values for each option that I can capture with Jquery.

http://www.ttmt.org.uk/val/


<!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" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>untitled</title>
	
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
	
	<style type="text/css">
	 *{
	   margin:0;
	   padding:0;
	 }
	 form{
	   margin:50px;
	 }
	</style>
	
</head>

<body>
  
  <form action="" method="">
    <select id="select">
      <option value="One" value1="OneOne">One</option>
      <option value="Two">Two</option>
      <option value="Three">Three</option>
      <option value="Four">Four</option>
      <option value="Five">Five</option>
    </select>
    <input type="submit" name="submit" id="set" value="Set" /> 
  </form>  



  <script type="text/javascript">
    $('#set').click(function(e){
      e.preventDefault();
      var val = $('#select').val();
      alert(val);
    })
  </script>
  
</body>
</html>

Is it possible to have more than one value in each option that I could then capture with jQuery.

So could I have


<option value="One" value1="OneOne">One</option>

and then capture it like


var val = $('#select').val();
//
var val1 = $('#select').val1();

This doesn’t work but is it possible to do this another way?

2

You could delimit the values then let the receiving script split them out:


<option value="Red|Green|Blue">One</option>
3

They could be split up with:


var values = $('#select').val().split('|');
// values[0] is 'Red', values[1] is 'Green', etc...