Implement Text to Speech in ASP.Net ListView using jQuery

Hi nauna,

Refer below code.

HTML

<asp:ListView ID="ListView1" runat="server">
    <ItemTemplate>
        <div>
            <asp:Label ID="lblterm" runat="server" Text='<%#Eval("Term") %>'></asp:Label>
            <asp:LinkButton ID="LinkButton1" runat="server" CssClass="voice"><i class="fa fa-volume-down"></i></asp:LinkButton>
        </div>
    </ItemTemplate>
</asp:ListView>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        if (!('speechSynthesis' in window)) {
            alert("You don't have speechSynthesis");
        }
        $('[id*=LinkButton1]').on('click', function () {
            var term = $(this).closest('div').find('[id*=lblterm]').html();
            var voices = window.speechSynthesis.getVoices();
            var speech = new SpeechSynthesisUtterance();
            speech.voice = voices[0];
            speech.rate = 1;
            speech.pitch = 1;
            speech.text = term;
            speechSynthesis.speak(speech);
            return false;
        });
    });
</script>

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.AddRange(new DataColumn[] { new DataColumn("Term") });
        dt.Rows.Add("Monthly");
        dt.Rows.Add("Quarterly");
        dt.Rows.Add("Yearly");
        ListView1.DataSource = dt;
        ListView1.DataBind();
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As DataTable = New DataTable()
        dt.Columns.AddRange(New DataColumn() {New DataColumn("Term")})
        dt.Rows.Add("Monthly")
        dt.Rows.Add("Quarterly")
        dt.Rows.Add("Yearly")
        ListView1.DataSource = dt
        ListView1.DataBind()
    End If
End Sub