Question

I have this html on a web page:

<select name="chapter_select" class="chapter_select">
<option value="http://www.example.com/chapter/1">Chapter 1</option>
<option value="http://www.example.com/chapter/2">Chapter 2</option>
<option value="http://www.example.com/chapter/3">Chapter 3</option>
<option value="http://www.example.com/chapter/4">Chapter 4</option>
<option value="http://www.example.com/chapter/5">Chapter 5</option>
<option value="http://www.example.com/chapter/6" selected="selected">Chapter 6</option>
</select>

And this variables:

getInformationsFromCurrentPage : function(doc, curUrl, callback) {
//This function runs in the DOM of the current consulted page
var curChapName = $("select.chapter_select:first option:selected", doc).text();
var chapurl = $("select.chapter_select:first option:selected", doc).val();
callback({"name": name, 
        "currentChapter": curChapName, 
        "currentMangaURL": nameurl, 
        "currentChapterURL": chapurl});
},
}

The problem is that both return the same text value. chapurl should return the url, not the text value. This was working until the website modified their site.

I know that I’m going to be pretty picky but this is the manual for the development of the extension and the doc variable is a must http://www.allmangasreader.com/dev.php just look out for the getInformationsFromCurrentPage function. It’s using the jQuery 1.4.2 so maybe its that, the weird thing is that other sites just work as it.

UPDATE: The server was using a script (rewriting the html) making me think that the dropdown list was on the top. I used some selectors to get the correct one following the source.

Answer 1

Could always use a fallback and use attr. This way you can always gaurantee that you’ll be getting the value.

var chapval = $("select.chapter_select:first option:selected").attr('value');

http://jsfiddle.net/dt5PV/